A design token separates a semantic design decision from one hard-coded value. Tokens can represent an accent color, body spacing, heading scale, panel radius, animation timing, or other recurring property.
Tokens make design systems easier to apply consistently across components and technologies. AI generation can reference the same named decisions instead of improvising slightly different values throughout an interface.
ELI5
A design token is a named value for a repeated design decision such as a color, spacing size, corner radius or animation duration. Components use the name instead of copying a raw value everywhere.
For example, buttons and links can use a token called accent color rather than each storing the same blue code. Changing that one token updates the shared design consistently and gives AI-generated components a clear rule to follow.
