UI FLOWKNOWLEDGE SYSTEM

色彩与装饰 · Color & Decoration

风格指南
Style Guide

规定颜色、字体、间距、圆角、图标、文案语气和组件用法的轻量规范。

A lightweight guide for color, type, spacing, radius, icons, voice, and component usage.

交互预览

这是 mianhua UI Glossary 的原生 Preview Runtime,不是静态截图。

可以直接对 Agent 说

请为这个项目生成一份可执行的「风格指南 / Style Guide」。

角色:你是一名负责产品视觉一致性的 UI/UX 设计师兼设计系统维护者。

目标:把“看起来统一”拆成团队可以执行的规则,让不同页面、组件和后续 AI 生成结果保持一致。

必须包含:品牌语气、颜色 token、字体层级、间距节奏、圆角、边框、阴影、图标规则、图片/插画原则、组件状态、文案语气和禁用项。

组件范围:至少覆盖按钮、输入框、卡片、表格、导航、弹窗、空状态、错误状态、加载状态和 focus 状态。每个组件要说明默认、hover、active、disabled、selected 的差异。

写法要求:不要只写“简洁、现代、高级”。要给可执行条件,例如圆角范围、色彩比例、标题/正文大小、边框透明度、图标线宽、动效时长和响应式降级方式。

输出格式:先给设计原则,再给 token、组件规范、Do/Don't、移动端规则、无障碍检查和验收清单。

相关可运行档案研究

该术语暂未建立精选案例映射,可从馆藏中继续搜索。

返回术语实验室 · 浏览完整馆藏 · 读取术语 API