菜单
Search across Chi Design System elements using natural language or keywords. Use when the user asks to find Chi elements, search for components by use case, or discover related utilities/tokens/components. Supports synonym expansion for better discoverability.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Validate Chi component usage against schemas. Use when validating component modifiers, checking for conflicts, verifying accessibility attributes, or generating correct component markup. Contains allowed modifiers, conflicting modifier groups, required attributes, and accessibility requirements.
Extract and provide information about Chi CSS components (buttons, alerts, modals, cards, etc.). Use when the user asks about Chi components, their modifiers, BEM structure, or Web Component equivalents. Reads SCSS source files directly.
Extract and provide information about Chi Design System design tokens (colors, typography, spacing, shadows, breakpoints, z-index). Use when the user asks about design tokens, SCSS variables, theme colors, spacing values, or any design token query. Reads SCSS source files directly.
Generate and sync MCP metadata for the Chi Design System. Use when the user asks to build, generate, or update the MCP metadata, or to sync Skills/Rules from SCSS sources.
Recommend the best Chi implementation approach based on project context. Use when the user asks which Chi approach to use (Vue, Web Components, or HTML/CSS), when starting a new project with Chi, or when migrating between approaches. Provides framework-specific guidance and code examples.
Extract and provide information about Chi utility classes (spacing, color, opacity, display, flex, border, typography, sizing, position, shadow). Use when the user asks about utility classes, CSS helpers, spacing, colors, or layout utilities. Reads SCSS source files directly.
| name | chi-search |
| description | Search across Chi Design System elements using natural language or keywords. Use when the user asks to find Chi elements, search for components by use case, or discover related utilities/tokens/components. Supports synonym expansion for better discoverability. |
When user searches for Chi elements, use these strategies in order:
Search for exact class names, component names, or token names:
src/chi/_global-variables.scssExpand search terms using the synonym dictionary in reference.md. Example: "center" also matches "middle", "centered", "align-center".
Match natural language queries to common use cases in reference.md.
Example: "center content" → -mx--auto, -d--flex, -justify-content--center, -align-items--center
If no exact match, try partial matches: "btn" → chi-button, "mod" → chi-modal
Results are ranked by relevance:
Search covers:
Return results grouped by type: