What new CSS properties are supported?

It covers modern CSS features supported in v4 like subgrid, logical properties, text-balance, and field-sizing for auto-growing inputs.

Can this help me migrate from Tailwind v3?

Yes, the skill includes specific patterns and guidance for converting tailwind.config.js settings into v4's modern CSS variables.

Does it support the new container query features?

Absolutely. It provides specific patterns for @container usage and defining container-specific breakpoints like @md and @lg.

How does this skill handle Tailwind v4's configuration?

It focuses on the new CSS-based @theme directive, moving away from JavaScript-heavy configuration files for a more native CSS experience.

Tailwind CSS v4 Pro

Name: Tailwind CSS v4 Pro
Author: Naw3

byNaw3

デザインツール

Streamlines styling workflows using Tailwind CSS v4's CSS-first configuration and modern utility patterns.

概要

This skill empowers Claude to efficiently implement and migrate to Tailwind CSS v4, leveraging the engine's new CSS-first architecture. It provides specialized knowledge for the @theme directive, native container queries, logical properties, and high-performance utilities like text-balance and field-sizing. Whether you're building modern UI components or upgrading from version 3, this skill ensures best practices for performance, accessibility, and maintainability in your frontend styling.

主な機能

Advanced utility patterns including subgrid, text-balance, and field-sizing
Migration guidance for transitioning from Tailwind CSS v3 to v4
Custom component styling with the new @utility directive
CSS-first theme configuration using the @theme directive
Native container query implementation for responsive component design
0 GitHub stars

ユースケース

Modernizing legacy Tailwind CSS v3 projects to the v4 architecture
Implementing design systems directly within CSS using custom properties
Building complex, responsive UI components using native container queries

概要

主な機能

Advanced utility patterns including subgrid, text-balance, and field-sizing
Migration guidance for transitioning from Tailwind CSS v3 to v4
Custom component styling with the new @utility directive
CSS-first theme configuration using the @theme directive
Native container query implementation for responsive component design
0 GitHub stars

ユースケース

Modernizing legacy Tailwind CSS v3 projects to the v4 architecture
Implementing design systems directly within CSS using custom properties
Building complex, responsive UI components using native container queries