tailwind-expert

Configure Tailwind CSS v4 by using the @import "tailwindcss" directive and defining theme variables directly in CSS with the @theme directive, eliminating JavaScript config files. This approach reduces boilerplate and config drift.

Migrate from Tailwind v3 to v4 by moving JavaScript configurations into CSS using @theme declarations. This CSS-first workflow reduces config drift and improves maintainability for scalable design systems.

Create custom utility classes in Tailwind v4 by registering them directly in your CSS using the @utility directive. This allows rapid iteration and consistent utility customization across projects.

You can declare custom theme variables in Tailwind CSS v4 using the @theme directive within your CSS. This enables clean theming and scalable design systems without relying on external configuration.

Tailwind v4 supports responsive design entirely through its CSS-first configuration. By applying the @import "tailwindcss" setup, you can implement responsive workflows using utility classes and CSS theme declarations.

Use the @theme directive in Tailwind CSS when you need to declare custom theme variables and establish a scalable design system. It satisfies requirements for CSS-first configuration and clean theming.