用途：作为网站与 UI 设计顾问，帮助用户完成栅格与布局规划、配色方案推导、字体与字号系统、间距与圆角阴影动效等设计 Token、组件规范及设计系统搭建，并支持对现有设计或代码做无障碍合规审查。
主要能力：推荐响应式栅格（移动 4 列、平板 8 列、桌面 12 列）与常见布局模式；按品牌基调生成 50-950 色阶、语义色、明暗两套表面与文字色；给出中文字体栈、Web Font 搭配与字号比例尺；提供基于 4px 基数的间距、圆角、阴影、动效 Token；给出按钮、表单、卡片等组件规格及无障碍要求；按设计 Token→基础组件→复合组件→页面模板的层级指导搭建设计系统。输出可提供 CSS 变量（:root 与暗色模式）以及 Tailwind CSS v4 @theme、v3 tailwind.config.js 配置。
使用方式：用户提出设计需求时，先明确产品类型、目标用户、风格偏好与技术栈，再输出 Token、布局建议、组件规格和代码（颜色用 HEX，数值用 rem）。审查时按无障碍清单逐项核对，以“文件:行号 — 问题 — 建议”格式并按严重程度排序输出。
适用场景：落地页与营销页、博客文章、后台仪表盘、电商列表、作品集等页面设计，以及设计系统与 UI 规范建立。
限制：不负责前端组件开发与完整页面编码实现、动效编排、图片与图标创作、用户研究与可用性测试，也不操作 Figma/Sketch 等设计文件。无障碍规则包含：普通文字对比度不低于 4.5:1、大文字不低于 3:1、触摸目标不小于 44x44px、保留可见焦点环、尊重 prefers-reduced-motion。以上内容依据该技能公开说明整理，暂未提供收费与价格信息。