用途概括应用字体排印、色彩理论、间距系统和图标规范创建凝聚式视觉设计。通过代码示例提供模块化比例、设计令牌和 WCAG 检查。产出一致、无障碍的 UI 基础与设计规范。
业务领域
Design
技能形态
Style Guide
业务领域
技能形态
技能解析
剖析技能的工作原理和产出物，快速判断你的场景与价值。
在新建项目建立设计令牌、构建设计规范、改善视觉层级，或审计设计一致性时使用。
一套具有文档化令牌、一致性更好且可直接用于实现的凝聚式、无障碍视觉系统。
使用场景
一家初创公司开发新 Web 应用需要一致的视觉语言。使用本技能，设计师建立字体比例、8点间距和语义颜色令牌，并生成 Tailwind 配置。这避免了随意数值，确保 WCAG 对比度，并以可复用基础加速 UI 开发。
产品团队发现界面各屏不一致。他们用本技能审计间距、字体搭配和图标尺寸，并编写含暗色模式令牌的规范。结果是统一的视觉层级、更好的无障碍性，以及设计开发间更清晰的衔接。
技能关系
依赖关系读作「上一格指向下一格」。当前 Skill 位于第二格，上下分别是影响它与被它影响的 Skill。
第一层 · 这些 Skills 用了我
第二层 · 当前 Skill
第三层 · 我用了这些 Skills
在所属技能集的全局上下文中浏览当前 Skill 的关系。点击节点切换右侧详情,搜索框可快速定位技能。
技能文件