Use to apply a web safe sans-serif font family:

Serif

Use .font-serif to apply a web safe serif font family:

Customizing

Font Families

By default Tailwind provides three font family utilities: a cross-browser sans-serif stack, a cross-browser serif stack, and a cross-browser monospaced stack. You can change, add, or remove these by editing the fonts section of your Tailwind config.

Font families can be specified as an array or as a simple comma-delimited string:

{
  // Won't work:
  'sans': ['"Exo 2"', ...],
  // ...or escape the space:
}

By default, only responsive variants are generated for font utilities.

You can control which variants are generated for the font utilities by modifying the fonts property in the modules section of your Tailwind config file.

For example, this config will also generate hover and focus variants:

Disabling