Tailwind CSS not Working for the Studio UI

I understand the confusion here! The situation with using Tailwind CSS in Sanity Studio v3 isn't as straightforward as it might seem, and unfortunately, there isn't clear official documentation on this specific setup.

Based on the community thread you referenced, the original poster resolved their issue by mentioning "Serializer is the cure" - but this is pretty vague and doesn't provide a complete picture of what actually works.

What We Know For Sure

Studio v3 uses Vite internally as its build system, but the Vite configuration isn't meant to be extended for Studio UI customization. The Tailwind Vite plugin approach mentioned in the Tailwind CSS article is specifically for building custom apps with the App SDK, not for customizing Studio itself.

The Documentation Gap

Here's the honest truth: there isn't clear, verified documentation for using Tailwind CSS to style Studio v3 UI customizations. The Studio customization guide you're following focuses on CSS Modules and doesn't officially cover Tailwind integration.

What the Community Has Found

The brief answer in that thread suggests that using "serializers" (likely referring to custom components or portable text serializers) was key to getting Tailwind classes to work. This hints that:

• Tailwind classes might work in custom React components you create for Studio
• The challenge is likely around ensuring Tailwind properly scans and includes those classes
• There may be additional configuration needed beyond a standard Tailwind setup

However, without more detailed documentation or community examples, the exact setup remains unclear.

My Recommendation

Since you're already using CSS Modules successfully, I'd suggest:

1. Stick with CSS Modules for Studio customization - it's the officially documented and supported approach
2. Use Tailwind for your frontend as you're already doing
3. Keep the styling separate - this actually provides cleaner separation between your content management interface and your public-facing site

If you really want to pursue Tailwind in Studio, I'd recommend asking in the Sanity Community on Discord where developers might have working configurations to share. If you do get it working, please consider sharing your setup back - it would help fill this documentation gap!

The reality is that CSS Modules are well-supported, work reliably with Studio customization, and you can achieve similar utility-based styling patterns if needed. Sometimes the "officially supported" path, even if less trendy, saves a lot of troubleshooting time.