CODEWITHSUNDEEP
cssreactjstailwind-css
user19816368
user19816368

Reputation:

How to set font-family: Arial; in Tailwind?


How do I set font-family: Arial; in Tailwind?
I'm using React and Tailwind on my project.
I'm using other Google font as * (applies all) and I want to use Arial in certain parts.
It's not working.
Also do I delete the default font-family in body tag (index.css) ?
Any help is appreciated.

Desired Font



How I did to customize the font in Tailwind.
tailwind.config

extend: {
   fontFamily: {
      "font-Arial": ["Arial"],
   },

index.jsx

<p className="font-Arial">Lorem Lorem Lorem</p>

Upvotes: 2

Views: 2683

Answers (1)

Gabriel Cunha
Gabriel Cunha

Reputation: 188

Try changing the string name like this:

fontFamily: {
   arial: ["Arial"],
}

And then you can call it using the className "font-arial"

Also, if still not working, you need to place your fontFamily outside of the "extend" property in talwind.config file, so it can load by default.

Upvotes: 4

Related Questions