How do I add custom tailwind designs?

[frail moat]

Since the tailwind config is gone in the latest version of nextjs, where do i put and add custom tailwind gradient design for my project?

[high mulch]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[full skiff]

globals.css

ref: https://tailwindcss.com/blog/tailwindcss-v4#css-first-configuration

[frail moat]

thank you

[frail moat]

I forgot to mention, does globals.css acts like an external css file? But for tailwind?

[full skiff]

not sure what you mean by 'external', but tailwind in v4 moves the entire config from a config.js file to the css file

[ember lodge]

globals.css is just the name. Doesn't matter what name you give it. By convention "globals" is the name Next.js gives to it, and it's the endtypoint to load Tailwind styles

[frail moat]

What does it do? Im still new to next js so i dont really dont know that much

[ember lodge]

globals.css is just a CSS file, and that file is being imported into your root layout, that’s why it acts as your entry point to load Tailwind styles.

You can leave it as it is and use the name next.js provides as the default (globals.css) or change it, or even create a new CSS file where you import tailwind and use that as the entry point, then you’ll have to import that file instead your root layout in order to have Tailwind configured correctly