0

I am trying to make an app, using tailwind for styling. The problem emerges when I try to use my variables with tailwind. I made seperate config for tailwind, declared the variables in global.css, but the styles do not apply. I want to use this way of styling since it is more readable. help.

I tried adding "content" to my config file, but that did not work either. even when I inspect the text in chrome, the style does not appear there.

Improve this question
2
  • 1
    If you update your question and include enough information to reproduce the issue, we can provide a more accurate solution. An incorrect installation or CSS specificity issues could also be causing the problem. Commented Oct 18 at 13:40
  • Related: From v4 the reset style cannot be overridden by TailwindCSS classes Commented Oct 18 at 13:41

1 Answer 1

Reset to default
0

The fact that your settings and utilities aren't working suggests an incorrect installation. There have been many breaking changes between v3 and v4.

In the latest version of TailwindCSS (v4), the JS-based tailwind.config.js file is no longer used by default. As a result, any configurations defined there are ignored by TailwindCSS.

Instead, a new CSS-first configuration approach has been introduced. The use of @tailwind directives has been removed - now, only a single import is required.

The mentioned content property is no longer needed - v4 comes with automatic source detection, which you can read more about here:

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.