设计系统
UI-UX Pro Max · Design System
三层设计 token、组件规格，还有守 token 的幻灯片生成。
这是什么
一个设计系统 Skill，以 CSS 变量覆盖原子、语义、组件三层 token，外加组件状态规格，以及一个用同一套 token 生成演示的工具。
Token architecture, component specifications, and slide generation. Three-layer tokens (primitive→semantic→component), CSS variables, spacing/typography scales, component specs, strategic slide creation. Use for design t
它对设计意味着什么
- 有了语义 token 层，明暗主题切换只是改配置，不用重写。
- 组件规格把 default、hover、active、disabled 状态列成表，交接不留模糊。
- 校验器揪出写死的色值，让组件和幻灯片都守在 token 系统里。
包含哪些内容
- Token architecture
- Component spec pattern
- Scripts
- Slide system
- Token compliance
- Best practices
如何安装
UI-UX Pro Max · Design System
-
克隆这个仓库。
git clone https://github.com/nextlevelbuilder/ui-ux-pro-max-skill -
把 Codex 指向这个 Skill 文件。
cli/assets/skills/design-system/SKILL.md -
然后描述你想要的界面，Codex 会照着这个 Skill 来做。
如何配合 Codex 使用
-
拿 JSON token 配置跑 generate-tokens.cjs，产出你的 CSS 变量文件。
-
让 Codex 出组件规格，再对 src/ 跑 validate-tokens.cjs 揪裸值。
-
用 search-slides.py 加上位置和场景参数，为演示挑版式。
这里的每个插件都免费开源，并附上真实的上游源地址。
在 codex-design 清单上了解更多 ↗
下一步
用 Open Design 做设计，省掉那些配置
你可以自己装这个插件，也可以用 Open Design 在 Codex 外面套一整层精选设计层。自带 API Key，产出归你所有。