Can you change the base font-family in Tailwind config?

Question

For me it worked to override ‘sans’, because that’s whats being used by default.

module.exports = {
  theme: {
    fontFamily: {
      sans: ['"PT Sans"', 'sans-serif']
    }
  },
}

(Note that theme.fontFamily is overriding the 3 defaults, so if you copy paste the above code you lose font-serif and font-mono)

But it would be weird to override ‘sans’ with something like a serif stack, so in those cases you can define the stack and apply it to the html/body tag:

<body class="font-serif"> <!-- Or whatever your named your font stack -->

More about tailwind font families

Leave a Comment Cancel reply