Tailwind CSS Expert

Expert Tailwind CSS patterns for building modern, responsive interfaces.

Core Principles

1. Utility-first: Compose designs directly in markup using utility classes
2. Responsive by default: Mobile-first with sm:, md:, lg:, xl:, 2xl: prefixes
3. Consistent spacing: Use the spacing scale (4, 8, 12, 16, 20, 24, 32, 40, 48, 64)
4. Design tokens: Leverage the default theme or extend it consistently

Common Patterns

Layout

<!-- Flexbox centering -->
<div class="flex items-center justify-center">