功能描述

Complete Tailwind CSS documentation. Use when working with Tailwind CSS utility classes, responsive design, dark mode, animations, custom configurations, plugins, or styling questions. Covers all utility classes, modifiers, configuration options, and best practices.

使用说明 (SKILL.md)

Tailwind CSS Documentation

Name: TailwindCss Complete Documentation
Author: leonaaardob

Complete Tailwind CSS documentation embedded in markdown. Read from references/ to answer questions about utility classes, responsive design, customization, and best practices.

Documentation Structure

All documentation is in references/ with individual files for each utility and concept:

Core Concepts

installation.mdx - Setup and installation
editor-setup.mdx - IDE configuration
using-with-preprocessors.mdx - SCSS, PostCSS integration
optimizing-for-production.mdx - Build optimization
browser-support.mdx - Browser compatibility

Layout & Spacing

container.mdx, columns.mdx - Layout utilities
aspect-ratio.mdx - Aspect ratio control
box-sizing.mdx - Box model
display.mdx - Display properties
float.mdx, clear.mdx - Floats
position.mdx - Positioning
top-right-bottom-left.mdx - Inset utilities
visibility.mdx, z-index.mdx - Z-index and visibility
padding.mdx, margin.mdx - Spacing
space-between.mdx - Gap utilities

Flexbox & Grid

flex-direction.mdx, flex-wrap.mdx, flex.mdx - Flexbox
flex-grow.mdx, flex-shrink.mdx, flex-basis.mdx - Flex sizing
order.mdx - Flex/grid order
grid-template-columns.mdx, grid-template-rows.mdx - Grid
grid-column.mdx, grid-row.mdx - Grid placement
gap.mdx - Grid/flex gap
justify-content.mdx, justify-items.mdx, justify-self.mdx - Justify
align-content.mdx, align-items.mdx, align-self.mdx - Align
place-content.mdx, place-items.mdx, place-self.mdx - Place

Typography

font-family.mdx, font-size.mdx, font-weight.mdx - Fonts
font-smoothing.mdx, font-style.mdx, font-variant-numeric.mdx
letter-spacing.mdx, line-height.mdx, line-clamp.mdx - Spacing
list-style-type.mdx, list-style-position.mdx - Lists
text-align.mdx, text-color.mdx, text-decoration.mdx - Text
text-transform.mdx, text-overflow.mdx, text-wrap.mdx
text-indent.mdx, vertical-align.mdx, whitespace.mdx
word-break.mdx, hyphens.mdx

Backgrounds

background-attachment.mdx, background-clip.mdx - Background
background-color.mdx, background-origin.mdx
background-position.mdx, background-repeat.mdx
background-size.mdx, background-image.mdx
gradient-color-stops.mdx - Gradients

Borders

border-radius.mdx, border-width.mdx, border-color.mdx - Borders
border-style.mdx, divide-width.mdx, divide-color.mdx
divide-style.mdx, outline-width.mdx, outline-color.mdx
outline-style.mdx, outline-offset.mdx, ring-width.mdx
ring-color.mdx, ring-offset-width.mdx, ring-offset-color.mdx

Effects & Filters

box-shadow.mdx, box-shadow-color.mdx - Shadows
opacity.mdx, mix-blend-mode.mdx, background-blend-mode.mdx
filter.mdx - Filters
blur.mdx, brightness.mdx, contrast.mdx, grayscale.mdx
hue-rotate.mdx, invert.mdx, saturate.mdx, sepia.mdx
backdrop-filter.mdx - Backdrop filters
backdrop-blur.mdx, backdrop-brightness.mdx, etc.

Transitions & Animations

transition-property.mdx, transition-duration.mdx - Transitions
transition-timing-function.mdx, transition-delay.mdx
animation.mdx - Animations

Transforms

scale.mdx, rotate.mdx, translate.mdx, skew.mdx - Transforms
transform-origin.mdx - Transform origin

Interactivity

accent-color.mdx, appearance.mdx, cursor.mdx - User interaction
caret-color.mdx, pointer-events.mdx, resize.mdx
scroll-behavior.mdx, scroll-margin.mdx, scroll-padding.mdx
scroll-snap-align.mdx, scroll-snap-stop.mdx, scroll-snap-type.mdx
touch-action.mdx, user-select.mdx, will-change.mdx

Customization

adding-custom-styles.mdx - Custom CSS
configuration.mdx - tailwind.config.js
content-configuration.mdx - Content paths
theme.mdx - Theme customization
screens.mdx - Breakpoints
colors.mdx - Color palette
spacing.mdx - Spacing scale
plugins.mdx - Plugin system
presets.mdx - Config presets

Advanced Features

dark-mode.mdx - Dark mode
reusing-styles.mdx - Component patterns
functions-and-directives.mdx - @apply, @layer, etc.

Quick Reference

Common Tasks

Task	File to Read
Setup Tailwind	`installation.mdx`
Responsive design	`responsive-design.mdx`, `screens.mdx`
Dark mode	`dark-mode.mdx`
Custom colors	`customizing-colors.mdx`, `colors.mdx`
Layout utilities	`container.mdx`, `display.mdx`, `position.mdx`
Flexbox	`flex-direction.mdx`, `justify-content.mdx`, `align-items.mdx`
Grid	`grid-template-columns.mdx`, `gap.mdx`
Typography	`font-size.mdx`, `font-weight.mdx`, `text-color.mdx`
Spacing	`padding.mdx`, `margin.mdx`, `space-between.mdx`
Backgrounds	`background-color.mdx`, `background-image.mdx`
Borders	`border-width.mdx`, `border-color.mdx`, `border-radius.mdx`
Shadows	`box-shadow.mdx`
Transitions	`transition-property.mdx`
Custom config	`configuration.mdx`, `theme.mdx`
Plugins	`plugins.mdx`

When to Use This Skill

Working with Tailwind CSS utility classes
Responsive design questions
Dark mode implementation
Custom Tailwind configuration
Plugin development
Migration to Tailwind
Styling patterns and best practices

How to Navigate

For specific utilities: Find the utility name file (e.g., flex.mdx, text-color.mdx)
For concepts: Check concept files (installation, dark-mode, responsive-design)
For customization: See configuration files (configuration, theme, plugins)
For best practices: Read reusing-styles, adding-custom-styles

All files are .mdx (Markdown + JSX) but readable as plain markdown.

安全使用建议

This skill appears to be a straightforward local copy of Tailwind CSS documentation and does not ask for credentials or install remote code, which is good. However, the SKILL.md triggered a 'base64-block' prompt-injection heuristic — you should manually inspect the full SKILL.md (and any large/truncated files) before installing. Look for embedded base64/data-URIs or long encoded strings and any instructions that go beyond 'read from references/'. Verify the source (owner ID is unknown), confirm license/attribution if that matters, and if you're unsure run the skill in an isolated/test agent or review the code files (references/utils/colors.ts) for dynamic eval/exec patterns. If SKILL.md simply contains data URIs or benign examples, the risk is low; if it contains encoded prompts or hidden instructions, do not install.

功能分析

Type: OpenClaw Skill Name: lb-tailwindcss-skill Version: 0.1.0 The skill bundle is primarily documentation for Tailwind CSS. The `references/utils/colors.ts` file uses Node.js `fs.promises.readFile` to access the local file system. While the target file (`node_modules/tailwindcss/theme.css`) and the purpose (extracting color definitions for documentation) are aligned with the skill's stated function, direct file system access is a high-risk capability that, without clear sandboxing or strict path validation, could be abused. There is no clear evidence of intentional harmful behavior, but the presence of this risky capability makes it suspicious.

能力评估

✓ Purpose & Capability

The name/description (Tailwind CSS documentation) match the packaged contents: many .mdx reference files and a README describing documentation extracted from tailwindlabs/tailwindcss.com. The skill declares no binaries, env vars, or config paths — consistent with a read-only documentation skill. A single small utility source file (references/utils/colors.ts) is present and appropriate for docs rendering.

ℹ Instruction Scope

SKILL.md tells the agent to read files under references/ to answer Tailwind questions, which is within scope for a documentation skill. However the static pre-scan flagged a 'base64-block' pattern in SKILL.md (prompt-injection pattern). That is unexpected for a pure doc skill and should be reviewed: look for embedded base64/data-uris or obfuscated text in SKILL.md or truncation/hidden instructions that might try to influence the agent.

✓ Install Mechanism

No install spec is present (instruction-only behaviour). Nothing is downloaded or written during install, minimizing install-time risk. The large file set is bundled with the skill, so no remote fetches are required.

✓ Credentials

The skill requires no environment variables, credentials, or config paths. This is proportionate for a documentation/reference skill.

✓ Persistence & Privilege

Flags are default (always: false, user-invocable: true). The skill does not request persistent privileges or system-wide configuration changes and does not claim to write other skills’ configs.

版本历史

v0.1.0

- Initial release of the Tailwind CSS skill, providing complete documentation and coverage for all utility classes, responsive design, configuration, plugins, and best practices. - Documentation is organized into modular `.mdx` files by topic, accessible via a clear structure and quick reference table. - Supports key topics: setup, utility classes, customization, dark mode, plugins, advanced features, and common styling tasks. - Includes guidance on how to navigate and leverage the embedded documentation for various Tailwind CSS questions.

元数据

Slug lb-tailwindcss-skill

版本 0.1.0

许可证 —

累计安装 7

当前安装数 4

历史版本数 1

常见问题

TailwindCss Complete Documentation 是什么？

Complete Tailwind CSS documentation. Use when working with Tailwind CSS utility classes, responsive design, dark mode, animations, custom configurations, plugins, or styling questions. Covers all utility classes, modifiers, configuration options, and best practices. 它是一个面向 Claude Code / OpenClaw 的 AI Agent Skill 插件，目前累计下载 1982 次。

如何安装 TailwindCss Complete Documentation？

在 OpenClaw 或 Claude Code 对话框中运行命令「/install lb-tailwindcss-skill」即可一键安装，无需额外配置。

TailwindCss Complete Documentation 是免费的吗？

是的，TailwindCss Complete Documentation 完全免费（开源免费），可自由下载、安装和使用。

TailwindCss Complete Documentation 支持哪些平台？

TailwindCss Complete Documentation 跨平台运行，可在任意部署了 OpenClaw / Claude Code 的环境中使用（cross-platform）。

谁开发了 TailwindCss Complete Documentation？

由 leonaaardob（@leonaaardob）开发并维护，当前版本 v0.1.0。

TailwindCss Complete Documentation