ChatGPT Radix 设计令牌技能：核对硬编码间距、字体和语义色
EnglishChatGPT 安装步骤
- 打开固定提交的 .claude/skills/frontend-design-tokens/SKILL.md，核对原文的输入和输出。
- 在 ChatGPT 打开「插件 → 技能 → 创建 → 使用编辑器创建」。
- 按下面的工作流程填写技能规则。提供 SCSS 或组件片段、Radix 属性说明和当前项目令牌表。
- 保存技能，在新对话输入本页的虚构示例并核对结果。
中文摘要
用项目提供的令牌表审查组件样式。把能匹配的间距、圆角、字体和颜色改写为 Radix 组件属性或 SCSS 变量，保留未知映射。
SKILL.md 中文导读
可复现示例
虚构组件写 `gap: 12px`、`border-radius: 8px` 和硬编码正文颜色。给定令牌表只有 `space-3` 为 12px、`text-primary` 为正文色。请给映射。工作步骤
- 找出可替换的硬编码值。
- 按用途映射组件属性或语义变量。
- 标记缺失令牌并列视觉回归检查。
验收方法
间距和正文色映射到给定令牌，圆角标待查。说明支持组件属性时优先采用对应间距属性，并保留样式验证项。
GitHub 原文 · 更新日期
适用环境
需要启用了技能创建的 ChatGPT 工作区。这里使用基于 GitHub 原文编写的文本改编。
常见问题
相同像素值是否可以使用任意一个令牌？
优先选择与用途和主题相符的令牌，检查组件支持方式。数值相同的字号、圆角和间距各有不同含义。