1.7 KiB
1.7 KiB
title, type, tags, last_updated, sources
| title | type | tags | last_updated | sources | |||||
|---|---|---|---|---|---|---|---|---|---|
| Visual Identity System | concept |
|
2026-05-15 |
|
Definition
视觉识别系统是品牌视觉元素的内聚性设计规范，包含 Logo、Color Palette、Typography 和 Spacing 四个核心维度。该系统必须作为整体设计，而非孤立元素集合。
Core Components
Logo System
- Primary Logo：主要标志及使用规范
- Logo Variations：水平、堆叠、图标版本
- Clear Space：最小间距要求
- Minimum Sizes：最小复制尺寸
- Usage Guidelines：使用注意事项
Color System
- Primary Palette：主品牌色（含 hex/RGB/CMYK 值）
- Secondary Palette：辅助色
- Neutral Palette：中性色（灰阶系统）
- Accessibility：WCAG 合规组合
Typography
- Primary Typeface：品牌标题字体
- Secondary Typeface：正文字体
- Hierarchy：尺寸和字重规范
- Web Implementation：字体加载和降级方案
Spacing System
基于 rem 单位的间距系统：
--brand-space-xs: 0.25rem--brand-space-sm: 0.5rem--brand-space-md: 1rem--brand-space-lg: 2rem--brand-space-xl: 4rem
Design Principles
- 内聚性：所有视觉元素协同工作形成统一系统
- 可扩展性：在不同应用场景和尺寸下保持有效性
- 无障碍：色彩对比符合 WCAG 标准
- 文化敏感性：在不同市场具有文化适当性
Connections
- Brand-Foundation-Framework → Visual Identity System 是其视觉表达
- design-brand-guardian → 定义了 Visual Identity System 的设计规范
- design-ux-architect → 提供 CSS 设计系统的技术实现规范
- Theme-Toggle → Visual Identity System 必须支持 light/dark/system 三态