メニュー
Generate or improve a complete design token system covering color, typography, spacing, radius, shadows, motion
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Full project design audit that orchestrates all agents, scores across 12 dimensions, generates prioritized action plan
Accessibility audit covering WCAG 2.2, contrast, focus, keyboard, screen reader, touch targets
Color-only audit to extract, evaluate, and recommend improvements for the project's color system
Component consistency audit covering state coverage, hierarchy, patterns
Interactive pre-launch design quality checklist
Compare current design against a reference or competitor
| name | design-tokens |
| description | Generate or improve a complete design token system covering color, typography, spacing, radius, shadows, motion |
| trigger | design tokens|generate tokens|token system |
Generate a complete design token system for the project.
/design-tokens # Auto-detect brand color, generate full system
/design-tokens #3b82f6 # Generate from specific brand color
/design-tokens --format tailwind # Output as Tailwind config
/design-tokens --format css-vars # Output as CSS custom properties
/design-tokens --format json # Output as JSON tokens
uiux_generate_tokens:
:root { --color-primary: ...; } with dark mode media querytailwind.config.js theme extension