Tailwind CSS v4

Purpose

Provide guidance for using Tailwind CSS v4 effectively in projects that are already configured, with an emphasis on utility-first patterns, maintainability, and theme variables.

Scope

• Included: utility composition, variants, responsive and container query patterns, theme variables, and custom CSS hooks.
• Excluded: installation, build tooling, and migration guidance.

When to Use

• You are authoring or refactoring UI in a Tailwind CSS v4 codebase.
• You need best-practice guidance for composing utility classes and managing reuse.
• You are defining or extending design tokens using theme variables.
• You need patterns for variants, responsive behavior, or container queries.

Response Guidance