← Back to list

color-tokens
by cdonohue
⭐ 0🍴 0📅 Jan 8, 2026
SKILL.md
name: color-tokens description: Generate accessible color tokens from a single accent color. Use when user wants to create or update color palettes, check accessibility contrast, or generate warm/cool adaptive gray scales. allowed-tools: Read, Write, Edit, Bash
Generate Color Tokens
Generate accessible color tokens from a single accent color following Dieter Rams' "Less, but better" philosophy.
Usage
- Ask user for the accent color (hex format, e.g.,
#ed8008) - Run:
node .claude/skills/color-tokens/generate.js "#hexcolor" - Review output with user
- Update
src/styles/tokens.csswith new values
What It Generates
- 10 adaptive grays that harmonize with the accent (warm/cool/neutral)
- Accessible text color for the accent (light or dark based on APCA contrast)
- CSS custom properties ready to paste
- Accessibility contrast checks
Example
node .claude/skills/color-tokens/generate.js "#ed8008"
Score
Total Score
40/100
Based on repository quality metrics
✓SKILL.md
SKILL.mdファイルが含まれている
+20
○LICENSE
ライセンスが設定されている
0/10
○説明文
100文字以上の説明がある
0/10
○人気
GitHub Stars 100以上
0/15
○最近の活動
3ヶ月以内に更新がある
0/10
○フォーク
10回以上フォークされている
0/5
✓Issue管理
オープンIssueが50未満
+5
✓言語
プログラミング言語が設定されている
+5
○タグ
1つ以上のタグが設定されている
0/5
Reviews
💬
Reviews coming soon