UI 构建约束

问题背景

让智能体写界面时，常见结果是「能跑但不像产品」：组件堆叠随意、间距与层级不一致、交互状态缺失，且每次对话都会漂移。若没有可复用的约束，模型会在 Tailwind 类名、布局模式和可访问性细节上反复 reinvent。

技能如何工作

本 skill 提供一套有明确主张且持续演进的界面构建指引与模式，供智能体在生成 UI 时作为默认参照，而不是临时即兴。

• 约束优先：在动手写 markup/CSS 前，先对齐布局、 typography、间距与组件边界等决策。
• 模式化输出：用约定好的结构描述页面区块、状态（hover/focus/disabled）与响应式断点，减少「一次一版」的样式分叉。
• 演进而非冻结：约束随实践更新，避免把过时写法固化成硬规则；更多细节以源仓库说明为准。

适用边界

适合需要界面一致性、希望 agent 在多次迭代中仍遵守同一套 UI 主张的场景。它不替代具体设计系统（Figma token、组件库版本），也不保证未在 skill 中声明的框架或设计规范；若项目已有强制的 Design System，应以项目文档为主，本 skill 作补充对齐。