Implements modern, utility-first styling using Tailwind CSS v4 principles and CSS-native configuration.
This skill provides Claude with deep expertise in Tailwind CSS v4 (2025), enabling the creation of high-performance, responsive interfaces using the Oxide engine. It guides the model through CSS-first configuration using the @theme directive, implements native container queries for component-level responsiveness, and utilizes modern design patterns like Bento layouts and OKLCH color systems. By enforcing current best practices, it ensures that generated styles are performant, maintainable, and leverage the latest browser capabilities without the overhead of legacy JavaScript configuration files.
主な機能
010 GitHub stars
02Optimized performance patterns leveraging the Rust-based Oxide engine
03Modern layout patterns including Flexbox, CSS Grid, and Bento grids
04Advanced color architecture using OKLCH and semantic design tokens
05Tailwind v4 CSS-first configuration via the @theme directive
06Native container query implementation for modular component responsiveness
ユースケース
01Implementing complex dark mode systems and design tokens without JavaScript-heavy configuration
02Migrating legacy Tailwind v3 projects to the v4 CSS-native architecture
03Building responsive component libraries that adapt to parent containers instead of just viewports
