‹ 首页

ss-tokens

@bitjaru · 收录于 1 周前 · 上游提交 今天

View, add, or modify design tokens in the StyleSeed design system

场景设计系统维护品牌视觉统一

适合你，如果你负责维护设计系统中的设计令牌

/ 下载安装
ss-tokens.skill双击,或拖进 Claude 桌面版 / Cowork,即完成安装↓ .skill↓ .zip
用别的 agent?下载 .zip 解压,把文件夹放进它的技能目录
Claude Code~/.claude/skills/(项目级 .claude/skills/)
Codex CLI~/.codex/skills/
Cursor自动读取上面两处目录
其他工具见其文档的「skills」目录;两个下载是同一份文件,只是名字不同
/ 通过 npx 安装 校验哈希
npx oh-my-skill add bitjaru/styleseed/ss-tokens
/ 通过 bash 安装
curl -fsSL https://oh-my-skill.com/install.sh | bash -s -- bitjaru/styleseed/ss-tokens
/ 已经装过?验证本机副本,不用重装
npx oh-my-skill verify bitjaru/styleseed/ss-tokens
安装目标可用 --agent / --scope 或 --to 明确指定;省略时只会在唯一已存在的 agent 目录上自动选择,零命中或多命中会停止并提示。content_hash 缺失或不一致均拒装。
–GitHub stars
~476上下文体积 · 单文件
镜像托管

怎么用

技能原文 SKILL.md作者撰写 · MIT · 3c5e387

Design Token Manager

When NOT to use
  • For applying tokens in components → use /ss-component or /ss-pattern
  • For finding token violations in existing code → use /ss-lint
  • For brand-wide color/font choices that don't exist yet — define a skin first, then add tokens
  • For non-CSS token systems (Figma, native iOS/Android) — Tailwind v4 / CSS variables only

Action: $0 | Token type: $1 Arguments: $ARGUMENTS

Token File Locations

| Type | JSON Source | CSS Implementation | |------|-----------|-------------------| | Colors | tokens/colors.json | css/theme.css :root + @theme inline | | Typography | tokens/typography.json | css/fonts.css + css/base.css | | Spacing | tokens/spacing.json | Tailwind utilities (no custom CSS needed) | | Radius | tokens/radii.json | css/theme.css @theme inline | | Shadows | tokens/shadows.json | css/theme.css :root |

Instructions
list — Show current tokens

Read and display the requested token file in a formatted table.

add — Add new token
  1. Add the token to the JSON source file (tokens/*.json)
  2. Add the CSS custom property to css/theme.css under :root
  3. If it needs a Tailwind utility, add to the @theme inline block
  4. If it has a dark mode variant, add to the .dark block
update — Modify existing token
  1. Update the value in the JSON source file
  2. Update the CSS custom property in theme.css
  3. Check all components for direct usage that might need updating
Rules
  • Always keep JSON and CSS in sync
  • Use semantic names, not descriptive names (--success not --green-500)
  • Colors should support both light and dark modes
  • New tokens must be added to BOTH the JSON source AND the CSS implementation
按 MIT 许可原样转载,未经改动 · 在 GitHub 查看 →

评论

登录即可评论;带「已验证安装」的,是发布者名下有本店的安装或持有记录。
…