Does this skill support Tailwind CSS v4.1?

Yes, this skill is specifically designed for Tailwind CSS v4.1, including the latest spacing scale calculations and CSS variable integrations.

Can it help me with negative margins?

Absolutely. It includes complete references for negative margin classes such as -m-*, allowing for advanced overlapping layout designs.

How does it handle spacing between child elements?

It provides expert patterns for the space-x-* and space-y-* utilities to manage gaps efficiently within flex and grid containers.

Is the spacing scale customizable?

Yes, it accounts for the configurable --spacing base unit (default 0.25rem), ensuring that generated classes match your project's specific theme scale.

Tailwind CSS Spacing

Name: Tailwind CSS Spacing
Author: fusengine

byfusengine

디자인 도구

Provides precise implementation of Tailwind CSS v4.1 margin, padding, and space-between utilities for frontend layouts.

소개

This skill equips Claude with specialized knowledge of the Tailwind CSS v4.1 spacing system, focusing on margin, padding, and space-between utilities. It enables the AI to accurately apply directional classes, negative margins, and auto-centering while adhering to the modern spacing scale based on CSS variables. By providing specific implementation patterns for containers, cards, and flex items, this skill ensures that generated frontend code is layout-consistent, responsive, and aligned with the latest Tailwind CSS best practices.

주요 기능

Detailed mapping of the configurable spacing scale and CSS variables
0 GitHub stars
Expert implementation of horizontal and vertical space-between patterns
Comprehensive reference for all Tailwind CSS v4.1 spacing classes
Guidance on best practices for consistent UI white space management
Support for negative margins and auto-centering utilities

사용 사례

Building responsive card components with standardized internal padding
Implementing pixel-perfect UI designs that require precise margin and padding control
Creating complex flexbox or grid layouts with uniform spacing between elements

소개

주요 기능

Detailed mapping of the configurable spacing scale and CSS variables
0 GitHub stars
Expert implementation of horizontal and vertical space-between patterns
Comprehensive reference for all Tailwind CSS v4.1 spacing classes
Guidance on best practices for consistent UI white space management
Support for negative margins and auto-centering utilities

사용 사례

Building responsive card components with standardized internal padding
Implementing pixel-perfect UI designs that require precise margin and padding control
Creating complex flexbox or grid layouts with uniform spacing between elements