Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Tailwind css, how to set default font color?

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?

like image 381
Oscar Franco Avatar asked Dec 16 '20 12:12

Oscar Franco


People also ask

How do I change the default font in Tailwind CSS?

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.

How do I change primary color in Tailwind?

You can configure your colors under the colors key in the theme section of your tailwind. config.

How do I change the default text color in CSS?

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.

How do you change the font color on Tailwind?

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.


2 Answers

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

like image 129
Oscar Franco Avatar answered Sep 28 '22 06:09

Oscar Franco


Could you just add the attribute to the body tag?

<body class="text-gray-800"></body>
like image 29
alexmcfarlane Avatar answered Sep 28 '22 08:09

alexmcfarlane