Agent Skills: Tailwind CSS Utility Classes — Index

Use when unsure which category skill covers a given utility class and need routing to the right one. Do NOT use for concrete class lookup - go to the category skill.

UncategorizedID: fusengine/agents/tailwindcss-utility-classes

Install this agent skill to your local

pnpm dlx add-skill https://github.com/Fusengine/claude-plugins/tree/HEAD/plugins/tailwindcss/skills/tailwindcss-utility-classes

Skill Files

Browse the full folder contents for tailwindcss-utility-classes.

Download Skill

Loading file tree…

plugins/tailwindcss/skills/tailwindcss-utility-classes/SKILL.md

Skill Metadata

Name
tailwindcss-utility-classes
Description
"Use when unsure which category skill covers a given utility class and need routing to the right one. Do NOT use for concrete class lookup - go to the category skill."
<objective> A routing index over Tailwind CSS utility-class categories — layout, spacing, typography, colors, borders, effects, state variants — mapping each category to its dedicated `tailwindcss-*` skill (layout/spacing/typography/backgrounds/borders/effects/interactivity) and, where useful, a specific section within it.

Routing only: contains no worked examples or concrete class lookups itself; load the linked category skill directly once the category is known. </objective>

Tailwind CSS Utility Classes — Index

Routing index only. Each category has its own skill with full worked examples — load that skill directly instead of this one when the category is known.

| Category | Skill | Covers | |----------|-------|--------| | Layout | tailwindcss-layout | display, flexbox, grid, position, container queries | | Spacing | tailwindcss-spacing | margin, padding, space-between | | Typography | tailwindcss-typography | font family/size/weight, text color/align/wrap, letter/line spacing, decoration | | Backgrounds/Colors | tailwindcss-backgrounds | background colors, gradients, images, blend modes | | Borders | tailwindcss-borders | border width/color/style/radius, outline, ring, divide | | Effects | tailwindcss-effects | shadows, opacity, filters, backdrop filters, masks | | State variants | tailwindcss-interactivity | hover/focus/active/disabled pseudo-class variants, cursor, scroll, pointer-events |

Border colors specifically live in tailwindcss-borders/references/border.md; text colors in tailwindcss-typography/references/text.md.