The working subset of colour theory for screens: three dimensions, a handful of harmonies, and perceptual colour spaces that behave predictably.
UI foundation · Color
Tag
tokens
Entries tagged tokens, drawn from across the library. Tags cut through the section structure, which is where most of the useful connections are.
17 entries across 4 sections
Type
Category
Level
17 entries
The dimension that determines contrast, hierarchy and whether text can be read at all.
UI foundation · Color
Colours assigned a fixed meaning, which only works if the assignment is consistent and never the only signal.
UI foundation · Color
A brand colour chosen for a logo usually needs adjustment before it can survive as an interface accent.
UI foundation · Color
Most of an interface is neutral, which makes the grey ramp the most used and least discussed part of a palette.
UI foundation · Color
A structured palette of ramps and semantic aliases, so colour decisions are made once rather than per screen.
UI foundation · Color
A fixed set of sizes derived from one ratio, so type decisions become selections rather than inventions.
UI foundation · Typography
Using size, weight, colour and space to make the structure of text visible before it is read.
UI foundation · Typography
The most space-efficient hierarchy lever, and the one most often limited by the typeface.
UI foundation · Typography
One file containing a continuous range of weights and widths, usually smaller than the static weights it replaces.
UI foundation · Typography
A fixed set of spacing values, so every gap in the product comes from the same vocabulary.
UI foundation · Layout
Named values that carry design decisions, so a change happens once rather than in every consuming file.
Design system · Foundations
Supporting several visual identities from one system, which is a token architecture problem before it is a design problem.
Design system · Foundations
Two libraries claiming to be the same system will diverge. Decide where truth lives, and make the other side derive from it.
Design system · Practice
A generous, modern-looking redesign made a dashboard slower for the people who used it all day.
Case study · Data products
Design system platform with token pipelines and documentation generation.
Tool · design-systems
Open-source build tool that transforms one token source into every platform format.
Tool · design-systems