GM

2023

Multibrand Design Tokens

Role

Sr. Product Designer

Company

GM

Industry

Automotive

Year

2023

Role

Sr. Product Designer

Company

GM

Industry

Automotive

Year

2023

Context

A shared foundation across brands

Aurora explored how design tokens could support seven GM brands across design and engineering. I contributed to the strategy and early framework, including experiments with color scales, token naming, and role mappings.

The strategy proposed centralizing brand styles and translating tokenized decisions into platform-specific formats. These two slides show that original direction.

GM token framework illustration

GM Core

Starting with GM Core

My involvement ended before the token proposal was completed. The following independent exploration builds on those early experiments to show how I would develop the framework further; it was not approved or implemented by GM.

I used the GM Core colors as a starting point. In this exploration, I kept the original base colors and adjusted a few shades to create smoother transitions within each color range.

gray.50
gray.100
gray.200
gray.300
gray.400
gray.500
gray.600
gray.700
gray.800
gray.900
gray.950
blue.50
blue.100
blue.200
blue.300
blue.400
blue.500
blue.600
blue.700
blue.800
blue.900
aqua.50
aqua.100
aqua.200
aqua.300
aqua.400
aqua.500
aqua.600
aqua.700
aqua.800
aqua.900
green.50
green.100
green.200
green.300
green.400
green.500
green.600
green.700
green.800
green.900
yellow.50
yellow.100
yellow.200
yellow.300
yellow.400
yellow.500
yellow.600
yellow.700
yellow.800
yellow.900
orange.50
orange.100
orange.200
orange.300
orange.400
orange.500
orange.600
orange.700
orange.800
orange.900
red.50
red.100
red.200
red.300
red.400
red.500
red.600
red.700
red.800
red.900

Naming

Names that describe purpose

Token names describe where a color is used and what it does. For interactive elements, the name without a state suffix represents the resting state. Adding hover or pressed identifies how it changes during interaction.

GM token framework illustration

Multibrand

One vocabulary, different brand values

The token name stays the same, but its value changes with the brand. Here, color.background.action uses GM Core blue in one example and an illustrative Chevrolet gold in the other. The text and background colors are chosen together so they work as a pair.

GM token framework illustration

A shared framework across brands and platforms

Each brand would map its colors to the same set of shared token names. The selected brand and light or dark appearance would determine which values are used. Those tokens could then be translated into formats for web, iOS, and Android, giving teams a consistent structure while allowing each brand to retain its identity.

GM token framework illustration

Additional project details and artifacts are not shown publicly to protect confidential work.

Create a free website with Framer, the website builder loved by startups, designers and agencies.