color theory

Accent Color

The color role in a design system reserved for brand identity, primary actions, and key signals, used with discipline so it holds its meaning.

The accent color is the color role that does the most brand work with the smallest footprint. Stripe's purple. Linear's purple. Notion's red. Each one appears in a tight set of places (primary CTAs, links, active states, brand flourishes) and nowhere else. That restraint is what gives the accent its recognition power. Treating accent as a tier rather than a specific hue is the modern shift. In a role-based color system, `accent-primary` is a token, not a color. You can swap the resolved value for a theme, a rebrand, or a white-label instance without touching anything else in the system. The common mistake is over-allocating accent colors. A design system with three accents, four semantic colors, and two highlight hues starts to feel like confetti. The strongest brands hold the line at one, maybe two accents. Everything else is neutral. The accent gets to mean something precisely because it shows up so rarely. Accent also does the heaviest hierarchy work. A single accent button on a neutral page is unmistakable. The same button on an already-colored page disappears. Accent and contrast are the same conversation.

Learn more in our full guide: Read the article

Related Terms