Tailwind 4 and Payload Admin

[wet sand]

I followed this video, and loading tailwind without the base only works in dev. if you make a production build it doesnt pick up the tailwind styling in the admin panel.

@layer theme, base, components, utilities;
@import 'tailwindcss/theme.css' layer(theme);
@import 'tailwindcss/utilities.css' layer(utilities);

do any of you guys have a way of making it work in a full production build?

https://youtu.be/n7AwZZVWYCA?si=LgGGErYOpROJBEO3

[upbeat fiber]

New Community-Help Thread Created!

Help is on the way! To mark it as solved, use the /solve command. In the meantime, here are some existing threads that may help you:

Documentation:

• Preventing Production API Abuse - Max Depth
• Swap in your own React components
• The Admin Panel
• Managing User Preferences - Adding or reading Preferences in your own components
• Customizing CSS & SCSS

Community-Help:

• tailwind 4

[red imp]

I have the same issue bru, did you manage to solve this?

[dry anvil]

this is what i use `@layer theme, base, components, utilities;

/* Import the Tailwind theme styles */
@import 'tailwindcss/theme.css' layer(theme);

/* Skip the preflight reset to avoid conflicts with Payload's admin styles /
/ @import 'tailwindcss/preflight.css' layer(base); */

/* Import Tailwind utilities */
@import 'tailwindcss/utilities.css' layer(utilities);

/* Support Payload’s dark mode toggle by adding a custom variant */
@custom-variant dark (&:where([data-theme=dark], [data-theme=dark] *));
`