用途：为 Web 项目提供可落地的 UI 设计模式与准则，让开发者在不依赖平面设计天赋的情况下构建精致、专业的界面，适用于任意 Web 项目，包括 TYPO3 前端开发。内容改编自《Refactoring UI》与《Practical UI（第2版）》。
核心原则：以降低可用性风险为决策依据（如浅灰文字影响可读性、无标签图标易致混淆、彩色标题易被误认为链接），兼顾视力不佳、电脑操作不熟练、灵活性下降及认知差异人群；每个设计细节都要有逻辑理由；降低交互成本（相关操作靠近、减少干扰、渐进披露）；降低认知负荷（分块信息、使用熟悉模式、去除多余元素、视觉分组）；先建立设计系统（配色及使用规则、字号阶梯、间距系统、组件模式、交互状态）；无障碍不可妥协，至少满足 WCAG 2.1 AA（小文本对比度 4.5:1，大文本 3:1，UI 元素 3:1），不可仅靠颜色传达信息；遵循 Jakob 定律使用常见模式；按 80/20 法则优先优化高频路径。
主要能力：从零开始的设计方法（先做功能而非布局、细节后置、先灰度后上色、循环迭代、先做最小可用版本）；层级处理（不只用字号，还用字重、颜色对比、间距；避免彩色背景上用灰字，改用同色相调整饱和度与明度；通过弱化次要元素来突出主元素；标签是最后手段；平衡字重与对比；按层级而非语义设计按钮，破坏性操作不自动用红色加粗）；布局与间距（从过多留白开始再删减、建立约 25% 跳变的间距刻度如 4/8/12/16/24/32/48/64/96/128px、不必填满屏幕、缩小画布、网格并非万能、相对尺寸不随屏幕等比缩放、避免歧义间距）。
使用方式：作为技能/参考文档按需加载，窄任务只读相关章节，需要详细示例、长模板、排错矩阵或附录时再阅读完整指南，以符合渐进披露原则。
限制：资料未提供具体安装命令、平台支持、收费或价格信息；内容为设计准则而非可直接运行的代码库，示例代码仅作说明用途。