Integrating Tailwind CSS v4 in ASP.NET Core

Tailwind CSS v4 is a major rewrite that changes how the framework compiles styles. Key changes include a new Rust-based compiler engine and CSS-first configuration.

Key Upgrades in v4

• No tailwind.config.js needed: Customize colors, fonts, and variants directly using CSS variables.
• Vite & CLI Integrations: Native compilation tools.
• Play CDN: Easy prototyping via @tailwindcss/browser.

Customizing Theme in CSS

You can declare custom theme colors directly in your main CSS file like this:

@theme {
  --color-primary: #7C6CF2;
  --color-secondary: #A78BFA;
  --color-accent: #C4B5FD;
}

Once defined, you can immediately use classes like bg-primary or text-secondary in your HTML views.