KPC
Kevin Powell - Community•3mo ago
ABUL KALAM

Fonts in tailwindcss

I was just curious, where does tailwindcss gets its fonts from? I just added this thing inside extend object of tailwind.config.js file and was able to use the font. 
fontFamily: {
  "proxima-nova": ["Proxima Nova", "sans-serif"],
},
fontFamily: {
  "proxima-nova": ["Proxima Nova", "sans-serif"],
},
6 Replies
Abdul Rehaman Shaikh
Abdul Rehaman Shaikh•3mo ago
Did you check if it was truly Proxima Nova? Have you installed this on your local machine? 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
Abdul Rehaman Shaikh
Abdul Rehaman Shaikh•3mo ago
In case you want to read: https://tailwindcss.com/docs/font-family
Font Family - Tailwind CSS
Utilities for controlling the font family of an element.
ABUL KALAM
ABUL KALAM•3mo ago
This is hosted on vercel.
No description
ABUL KALAM
ABUL KALAM•3mo ago
The other two font-family properties are overwritten here.
No description
Abdul Rehaman Shaikh
Abdul Rehaman Shaikh•3mo ago
Yes. Have you read the article from the link I shared? I hope you will understand from it 🙂
ABUL KALAM
ABUL KALAM•3mo ago
I have read it. None of the sections specifies what fonts can be used in tailwindcss. I picked a random font from fonts.google.com, added it to the tailwind config file and it worked.
Want results from more Discord servers?
Add your server
More Posts
CSS Custom Property override on a custom element with attribute selectors doesn't work as expectedCan someone here explain to me why the second instance of my `calcite-chip` component isn't styled pWebsite for Discord Botis it good enough? idk did i made it too much for a Discord bot?Force CSS Grid to follow the order of li elements of a ul in the HTML code.I have this code: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meFlexbox, show elipses instead of wrapping when screen shrinks (tsx)Hello, I've been racking my brain figuring out why this code works on codepen but not on my own codeI'm having trouble when deploying on Github PagesPretty ambiguous question but I haven't found a solution yet. I did a quick project with SASS and whWhy does the eyes stand outside of the div and get pushed down?the eyes keep standing outside of the eyes div even though they are in the same class. why is this hworking with api's using fetchI am trying to figure out why this is not working properly. I keep getting undefine when I console.lInteresting JS effectNot sure if the is the right place to ask if its possible to reproduce the effect of the blue femaleCSS keeps adding an unnecessary gapRight, so I've made a div with an input and button. Here is the CSS: .subscribe-box { background-need help with model positioning in three fiberi have been trying to add 3d planet/moon models in my project and i want them to rotate like a plane