I'm using tailwind css in my project, due to our application styles we are using a default font color, however I cannot seem to find how to do this in tailwind, the documentation page only talks about extending the color palette, but not how to set a default color.
Any ideas on how to achieve this?
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 theme.fontFamily section of your Tailwind config.
You can configure your colors under the colors key in the theme section of your tailwind. config.
Simply add the appropriate CSS selector and define the color property with the value you want. For example, say you want to change the color of all paragraphs on your site to navy. Then you'd add p {color: #000080; } to the head section of your HTML file.
To control the text color of an element on hover, add the hover: prefix to any existing text color utility. For example, use hover:text-blue-600 to apply the text-blue-600 utility on hover.
I ended up solving this in the dumbest way possible, on a global css file:
html {
@apply text-gray-800
}
Not pretty but at least I can use the tailwind classes
Could you just add the attribute to the body tag?
<body class="text-gray-800"></body>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With