Add Google Fonts in Tailwind CSS (React & NextJS) | 2024

[@placeholderhandlehere]

Straight to the point, I wish more videos were like this!

[@guvenfazli]

This is the best guide in entire youtube. Straight to the point, thanks a lot.

[@pankajSingh-h1h6x]

thanks for help from India

[@OA_Dev]

Not a problem!

[@GamingInDoor]

searched a lot for this your video was what worked for me thank you very much.

[@OA_Dev]

I’m glad to hear! Not a problem at all. What are you working on?

[@GamingInDoor]

@@OA_Dev just creating a basic typing website.

[@SanjaySinghania-mu4ol]

straight to the point

[@bydewa78]

cheers, straight to the answer, thanks mate

[@nesivapama]

For some reason this is not working with Tailwind 4 and react

[@NoTimeWaste1]

Thanks man!

[@NIPŊ]

More videos like this!

[@OA_Dev]

I love to make more, what other topics would you like me to focus on?

[@karfagen86]

Are the fonts uploaded to your server and cached? After you have written in the font-title class? Or will they be loaded after the project is built?

[@OA_Dev]

They are called from Google Fonts when the project is loaded, if you download the font then it would be cached

[@Akash-to3xs]

thank you for your help

[@judoScott]

Thank you. That was easy, but how do I use different font weights?

[@yashsoni8043]

how to do bro i did the same but my font didnt change

[@OA_Dev]

Usually with google fonts, the font weights tend to come with it if they are listed on the fonts specific page. What font were you trying to use?

[@kaizenaadhi]

Thnkyou

[@deadcode1548]

i dont know why but its not working for me. every thing is correct . """ title:["Anton" , "sans-serif"] """ in this part only the sans-serif work not Anton 😪

[@OA_Dev]

Ahh I see. To confirm in the styles.css file you have "@import url('fonts.googleapis.com/css2?family=Anton&display=swap')" above the tailwind imports?

[@deadcode1548]

@OADevelopment Yes, i have done that too, but it doesn't work 😕 . I have seen other videos . All of them do the same thing, and its not working for me

[@OA_Dev]

@@deadcode1548 If the issue still persists I would love to take a look at it further and see if I can find the solution here