该技能用于构建仪表盘、SaaS 界面、管理后台等需要精致专业设计的界面，覆盖设计方向、工艺原则与 9 阶段实现流程。
用途与方向：要求写代码前先确定设计方向，明确产品性质、用户类型、情感目标与记忆点。强调 SaaS 产品界面不等同营销落地页，应以信息层级、快速交互与清晰反馈为核心，玻璃拟态、渐变、发光等只作点缀。方向按「意图→结构→表层」推进，先定信息架构，再建立视觉层级，最后选择个性与美学。
个性与配色：可选用精密高密度、温暖亲和、精致可信、大胆清晰、实用功能、数据分析等个性，并给出圆角、阴影、间距、配色的对应起点。配色需考虑暖色、冷色、纯净中性或带色偏基础，亮色或暗色，并只选一个有含义的强调色。
工艺原则：采用 4px 间距网格；交互元素点击区至少 44px；可点击元素一律 cursor: pointer；内边距需对称；圆角保持一致；深度策略只选一种（仅边框、单层阴影、分层阴影或表面色差）；玻璃用于结构分层而非装饰；卡片内部结构按内容设计但表面处理保持一致；数值、ID、时间戳用等宽与 tabular-nums；使用 Phosphor 图标；建立前景→次级→弱化→极弱的四级对比；颜色仅用于表达含义。提供 Swap、Squint、Signature、Token 四项反默认测试。
9 阶段实现：依次为字体、颜色系统、阴影与高度、动画系统、核心组件、布局组件、领域组件、数据展示、页面与最终打磨；每阶段有交付物与注意点，组件完成前需检查意图、层级、状态、反默认、触控区与光标。
使用方式与限制：资料未提供具体安装命令或调用方式。原文提醒不要与组件库（如 shadcn/ui、Radix）的无障碍模式对抗，应通过 CSS 变量与 className 覆盖增强视觉层。暗色模式下多用边框而非阴影，并适当降低状态色饱和度。资料中的字体与 Token 代码片段属示意，采用前应结合自身项目验证。