m-tokens
Generate a complete design token set from the current codebase. Extracts colors, type, spacing, shadows, radii and outputs as CSS variables, Tailwind, SCSS, or JSON.
- License 许可
- Apache-2.0
- 最近更新
- 2026-03-21
- Stars
- ★ 1
- Forks
- 0
01 前言 Front Matter
- name
- m-tokens
- description
- Generate a complete design token set from the current codebase. Extracts colors, type, spacing, shadows, radii and outputs as CSS variables, Tailwind, SCSS, or JSON.
- user-invokable
- true
03 SKILL.md 正文
/m-tokens — Generate Tokens
Analyze the codebase and extract a token system:\n\n1. Discover all color values, group similar ones, generate palette\n2. Detect type scale ratio, output scale tokens\n3. Map spacing values to nearest 4px grid, output scale\n4. Extract shadow patterns, normalize to elevation system\n5. Map radii to a scale\n\nOutput in 4 formats: CSS custom properties, Tailwind config, SCSS variables, W3C Design Tokens JSON.
04 同仓库更多 Skills
meridian-design
Design DNA engine that learns your codebase before making recommendations. Maps 8 design axes (typography, color, layout, motion, accessibility, tokens, hierarchy, personality), builds a project-aware profile in .meridian.json, and enforces your established aesthetic. 62 commands across 5 tiers. Every command respects what you've already built. Use on any frontend project to prevent AI slop while preserving design intent.
m-z-index
暂无简介
m-type-set
Apply a complete typography system in one command. Scale, pairing, line-heights, letter-spacing.
m-type-scale
Generate a mathematical type scale from a base size and ratio. Outputs 8 steps with px values, rem equivalents, and CSS custom properties.
m-type-pair
Font pairing recommendations. Display + body + mono. Never suggests banned fonts.
m-type-fix
Auto-fix typography issues. Replace banned fonts, normalize scale, add line-height.