how to do theming with Tailwind CSS insted of css variables

[milon27]

when generating a theme from https://ui.shadcn.com/themes here, we only get the values in CSS variables but I am using tailwind CSS classNames How to use these generated themes now?

Thanks.

[itaim18]

Basically wherever you declare:

@tailwind base;
@tailwind components;
@tailwind utilities;

prefarebly, in a Next.js app in a globals.css under app router/pages folder
there you would declare these variables in the @layer base.
These variables would automatically be available as background and text colors and other variables could also be used such as

...
className="bg-popover text-muted border-border"
...

Hope this helps :)