Individual skill
tailwind
Tailwind CSS v4 performance optimization and best practices guidelines (formerly tailwindcss-v4-style). This skill should be used when writing, reviewing, or refactoring Tailwind CSS v4 code to ensure optimal build performance, minimal CSS output, and correct usage of v4 features. Triggers on tasks involving Tailwind configuration, @theme directive, utility classes, responsive design, dark mode, container queries, or CSS generation optimization.
skills/.curated/tailwind/SKILL.md
Source commit cf93c57cac89d6fc3e4194686000411567f5caf3
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- No
- Repository scan complete
- No
- Skill scan complete
- Yes
- Observed behavior
- Not checked yet
- Last checked
- Nov 5, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 222
- Repository last updated
- Aug 15, 2026
- License
- MIT
Observed agent integration: codex
- design Derived category
- writing Derived category
- devops Derived category
- devops-containers Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
AGENTS.mddoc · 8,960 bytesREADME.mddoc · 4,623 bytesSKILL.mdcore · 7,267 bytesassets/templates/_template.mddoc · 876 bytesmetadata.jsonasset · 932 bytesreferences/_sections.mddoc · 2,062 bytesreferences/anim-3d-transforms.mddoc · 1,643 bytesreferences/anim-gpu-accelerated.mddoc · 1,395 bytesreferences/anim-gradient-interpolation.mddoc · 1,363 bytesreferences/anim-starting-style.mddoc · 1,461 bytesreferences/build-cli-package.mddoc · 924 bytesreferences/build-content-detection.mddoc · 1,255 bytesreferences/build-css-import.mddoc · 993 bytesreferences/build-node-version.mddoc · 1,038 bytesreferences/build-postcss-simplify.mddoc · 1,103 bytesreferences/build-vite-plugin.mddoc · 1,301 bytesreferences/bundle-avoid-cdn-production.mddoc · 1,262 bytesreferences/bundle-avoid-preprocessors.mddoc · 1,276 bytesreferences/bundle-css-minification.mddoc · 1,323 bytesreferences/bundle-remove-unused-plugins.mddoc · 1,201 bytesreferences/bundle-split-critical-css.mddoc · 1,798 bytesreferences/comp-avoid-apply-overuse.mddoc · 1,556 bytesreferences/comp-container-customize.mddoc · 1,156 bytesreferences/comp-custom-variant.mddoc · 1,783 bytesreferences/comp-reference-directive.mddoc · 1,279 bytesreferences/comp-smart-sorting.mddoc · 1,368 bytesreferences/comp-utility-file-scope.mddoc · 1,378 bytesreferences/gen-avoid-theme-bloat.mddoc · 2,011 bytesreferences/gen-css-first-config.mddoc · 1,286 bytesreferences/gen-css-variable-syntax.mddoc · 1,111 bytesreferences/gen-dynamic-utilities.mddoc · 1,273 bytesreferences/gen-oklch-colors.mddoc · 1,052 bytesreferences/gen-utility-directive.mddoc · 1,226 bytesreferences/resp-container-queries.mddoc · 1,448 bytesreferences/resp-custom-breakpoints.mddoc · 1,253 bytesreferences/resp-hover-capability.mddoc · 1,752 bytesreferences/resp-logical-properties.mddoc · 1,375 bytesreferences/resp-mobile-first.mddoc · 1,364 bytesreferences/theme-color-scheme.mddoc · 1,388 bytesreferences/theme-dark-mode-class.mddoc · 1,403 bytesreferences/theme-inline-static.mddoc · 1,887 bytesreferences/theme-prefix-variables.mddoc · 1,281 bytesreferences/theme-runtime-variables.mddoc · 1,335 bytesreferences/theme-semantic-tokens.mddoc · 1,487 bytesreferences/util-explicit-colors.mddoc · 1,142 bytesreferences/util-gradient-via-none.mddoc · 1,176 bytesreferences/util-important-modifier.mddoc · 937 bytesreferences/util-opacity-modifier.mddoc · 1,077 bytesreferences/util-renamed-utilities.mddoc · 1,291 bytesreferences/util-variant-stacking.mddoc · 1,093 bytes
Read excerpt
# Community Tailwind CSS v4 Best Practices
Comprehensive performance optimization guide for Tailwind CSS v4 applications. Contains 44 rules across 8 categories, prioritized by impact to guide automated refactoring and code generation.
## When to Apply
Reference these guidelines when:
- Configuring Tailwind CSS v4 build tooling (Vite plugin, PostCSS, CLI)
- Writing or migrating styles using v4's CSS-first approach
- Optimizing CSS bundle size and build performance
- Implementing responsive designs with breakpoints or container queries
- Setting up theming with @theme directive and design tokens
## Rule Categories by Priority