UI 设计规范（通用模板）

框架无关的 UI 设计规范骨架。请根据你的技术栈（Flutter/SwiftUI/Electron/React 等）填充具体内容。与 ui-prototype 规则配合使用：原型阶段用 ui-prototype 验证布局，实现阶段用本 skill 指导代码质量。

生成有辨识度、生产级的界面，避免千篇一律的"AI 味"设计。

Design Thinking

写代码前，先确定美学方向：

Purpose — 这个界面解决什么问题？用户是谁？使用频率如何？
Tone — 选择一个明确的风格立场（极简克制、信息密集、温暖有机、冷峻工业、杂志编辑风等）。
Constraints — 平台约束、性能要求、无障碍需求。
Differentiation — 什么让这个界面令人印象深刻？一个记忆点就够。

核心原则：大胆极繁和精致极简都行，关键是 intentionality — 每个设计决策都有理由。

主题系统（唯一真相源）

核心规则

色彩通过主题系统的语义化 token 引用，不在组件中硬编码色值
文字样式通过主题的排版层级引用，不在组件中手写字号/字重

UI 设计规范（通用模板）

框架无关的 UI 设计规范骨架。请根据你的技术栈（Flutter/SwiftUI/Electron/React 等）填充具体内容。与 ui-prototype 规则配合使用：原型阶段用 ui-prototype 验证布局，实现阶段用本 skill 指导代码质量。

生成有辨识度、生产级的界面，避免千篇一律的"AI 味"设计。

Design Thinking

写代码前，先确定美学方向：

Purpose — 这个界面解决什么问题？用户是谁？使用频率如何？
Tone — 选择一个明确的风格立场（极简克制、信息密集、温暖有机、冷峻工业、杂志编辑风等）。
Constraints — 平台约束、性能要求、无障碍需求。
Differentiation — 什么让这个界面令人印象深刻？一个记忆点就够。

核心原则：大胆极繁和精致极简都行，关键是 intentionality — 每个设计决策都有理由。

主题系统（唯一真相源）

核心规则

色彩通过主题系统的语义化 token 引用，不在组件中硬编码色值
文字样式通过主题的排版层级引用，不在组件中手写字号/字重

Ui Design Conventions

UI 设计规范（通用模板）

Design Thinking

主题系统（唯一真相源）

核心规则

Ui Design Conventions

UI 设计规范（通用模板）

Design Thinking

主题系统（唯一真相源）

核心规则

禁止

美学规范

色彩

字体与排版

空间与布局

动效与交互

视觉细节与质感

平台特有考量

桌面端

移动端

实现要求

反模式清单

Notion

Prose

Coding Agent (bash-first)

Continuous Learning

Security Review

Widget Generator