Skip to content

设计基础 (Foundation)

设计系统的基础层:原则、颜色、交互规范


文档列表

文档说明
01-Colors基础颜色定义
02-Design-Principles设计原则(信任优先、渐进复杂度)
03-Theme-Colors主题配色系统(配色对、钱包主题色)
04-Interaction-Specs交互规范(触摸、手势、动效、可访问性)

快速参考

行为约束级别

级别含义后果
MUST必须遵守违反导致功能缺陷或安全问题
SHOULD建议遵守不遵守会降低用户体验
MAY可选实现增强体验但非必需
MUST NOT禁止行为违反导致严重问题

设计核心原则

  1. 信任优先 - 透明、可控、安全提示
  2. 渐进复杂度 - 新手友好,进阶可选
  3. 响应式设计 - 移动优先,360px 为设计基准

配色对规则

tsx
// ✅ 配套使用
<Button className="bg-primary text-primary-foreground" />

// ❌ 禁止单独使用 foreground
<span className="text-primary-foreground" />

触摸目标最小尺寸

  • iOS: 44 × 44 px
  • Android: 48 × 48 dp

相关文档

Released under the MIT License.