back
loading skill details...
Tailwind CSS utility-first CSS framework. Use when styling web applications with utility classes, building responsive designs, or customizing design systems…
Utility-first CSS framework for rapidly building custom interfaces with composed utility classes. Covers layout (flexbox, grid, positioning, sizing, spacing), transforms, typography, visual effects, and interactivity through organized utility categories Supports responsive design with mobile-first breakpoints, container queries, and conditional variants for state, pseudo-classes, and media queries Tailwind v4 introduces CSS-first configuration using theme variables and directives (@theme, @utility, @custom-variant) for easier design system customization Includes dark mode support, custom style and utility creation, and content detection for automatic class scanning Tailwind CSS The skill is based on Tailwind CSS v4.1.18, generated at 2026-01-28. Tailwind CSS is a utility-first CSS framework for rapidly building custom user interfaces. Instead of writing custom CSS, you compose designs using utility classes directly in your markup. Tailwind v4 introduces CSS-first configuration with theme variables, making it easier to customize your design system. Core References Topic Description Reference Installation Vite, PostCSS, CLI, and CDN setup core-installation Utility Classes Understanding Tailwind's utility-first approach and styling elements core-utility-classes Theme Variables Design tokens, customizing theme, and theme variable namespaces core-theme Responsive Design Mobile-first breakpoints, responsive variants, and container queries core-responsive Variants Applying utilities conditionally with state, pseudo-class, and media query variants core-variants Preflight Tailwind's base styles and how to extend or disable them core-preflight Layout
don't have the plugin yet? install it then click "run inline in claude" again.