Design Token
A named value representing a design decision (color, spacing, typography) shared across design and code systems.
技术细节
Design Token is a foundational concept in visual design theory. It influences how users perceive and interact with interfaces, affecting readability, hierarchy, and aesthetic appeal. The design principles behind design token are codified in systems like Material Design 3, Apple's Human Interface Guidelines, and the W3C's Web Content Accessibility Guidelines. Implementing design token correctly requires balancing aesthetic intent with accessibility requirements and cross-platform consistency.
示例
```json
{
"color": {
"primary": { "value": "#2563eb", "type": "color" },
"text": { "value": "#1a1a1a", "type": "color" }
},
"spacing": {
"sm": { "value": "0.5rem", "type": "dimension" },
"md": { "value": "1rem", "type": "dimension" },
"lg": { "value": "2rem", "type": "dimension" }
},
"font": {
"body": { "value": "Inter, system-ui, sans-serif", "type": "fontFamily" }
}
}
```