TailwindCSS工具类

Fusengine2026-10-24查看 1798复制 1743

当需要单个入口点来查找哪个分类 tailwindcss-* 技能涵盖给定实用程序类时使用。仅路由器/索引 - 不用于实际的类内容。

Download (.md)

📘如何使用这个技能

  1. 1
    复制技能内容·点击上方「Copy SKILL.md」复制全部内容,或 Download 下载到本地
  2. 2
    打开你的 AI 客户端·支持 Claude Code、Trae、Cursor、ChatGPT、DeepSeek、Kimi 等任意 AI 助手
  3. 3
    粘贴为系统提示/知识文件·Claude Code:放入 .claude/skills/ 目录;普通对话:作为首条消息发送并说「请严格按这份技能文档执行」
  4. 4
    直接提出你的需求·AI 会按技能定义的工作流、格式和约束来处理,无需再解释背景

💡 提示:技能生效后,每次对话只需一句需求,AI 会按 SKILL.md 的流程执行。

SKILL.md2003 chars
---
name: tailwindcss-utilities
description: "Use when needing a single entry point to find which categorical tailwindcss-* skill covers a given utility class. Router/index only - do NOT use for actual class content."
user-invocable: false
---

<objective>
A routing index over the categorical Tailwind CSS skills — layout, spacing, typography, backgrounds, effects, borders, transforms — mapping utility-class families (flexbox/grid, padding/margin, font/text, colors, shadows, borders, transforms/transitions) to the specific `tailwindcss-*` skill and section that documents them.

Contains no utility-class content itself; every entry links straight to the category skill that owns the worked examples.
</objective>

# Tailwind CSS Utilities Reference

## Layout
- Flexbox, Grid, Position, Display -> [tailwindcss-layout](../tailwindcss-layout/SKILL.md)

## Spacing
- Padding -> [tailwindcss-spacing](../tailwindcss-spacing/SKILL.md#padding-classes)
- Margin -> [tailwindcss-spacing](../tailwindcss-spacing/SKILL.md#margin-classes)
- Width -> [tailwindcss-sizing](../tailwindcss-sizing/SKILL.md#width-utilities)
- Height -> [tailwindcss-sizing](../tailwindcss-sizing/SKILL.md#height-utilities)

## Typography
- Font size, font weight, text align, line height -> [tailwindcss-typography](../tailwindcss-typography/SKILL.md)

## Colors & Effects
- Color palette, background color -> [tailwindcss-backgrounds](../tailwindcss-backgrounds/SKILL.md#background-colors)
- Box shadow -> [tailwindcss-effects](../tailwindcss-effects/SKILL.md#box-shadow)
- Opacity -> [tailwindcss-effects](../tailwindcss-effects/SKILL.md#opacity)

## Borders
- Border width, border radius, outline -> [tailwindcss-borders](../tailwindcss-borders/SKILL.md)

## Transforms
- Transform, translate, rotate, scale -> [tailwindcss-transforms](../tailwindcss-transforms/SKILL.md#transform-utilities)

## Transitions
- Transition property, animation -> [tailwindcss-transforms](../tailwindcss-transforms/SKILL.md#transition-utilities)
来源:skillsdirectory

评论0

登录后参与评论

还没有评论,来抢沙发吧