OpenAI

OpenAI's brand palette as observed on the live marketing site (openai.com). The brand is monochrome-first: a pure-white canvas with pure-black foreground in light mode, inverted in dark, and a calibrated five-stop neutral ramp ("primary" / "secondary" / "tertiary") for surfaces and quiet emphasis. OpenAI's research and documentation surfaces additionally publish a "hue" scale (red, blue, green, yellow, magenta, lime) used in diagrams, code-syntax highlighting, and data visualization. These are preserved here as a documented secondary scale.

21 swatches 15 light roles 15 dark roles openaiaibrandminimalmonochrome

Swatches

openai-black
#000000
Canvas in dark mode; foreground in light mode.
openai-white
#FFFFFF
Canvas in light mode; foreground in dark mode.
primary-solid-4
#1F1F1F
Subtle elevated surface on dark canvas.
primary-solid-12
#333333
Borders / quiet dividers on dark canvas.
primary-solid-44
#707070
Tertiary text on dark canvas.
primary-solid-60
#999999
Secondary text on dark canvas.
primary-solid-80
#CCCCCC
Primary muted text on dark canvas.
secondary-solid-4
#F5F5F5
Subtle elevated surface on light canvas.
secondary-solid-12
#E0E0E0
Borders / quiet dividers on light canvas.
secondary-solid-44
#8F8F8F
Tertiary text on light canvas.
secondary-solid-60
#666666
Secondary text on light canvas.
secondary-solid-80
#333333
Body text on light canvas.
tertiary-solid-60
#888888
Mid-tone neutral.
tertiary-solid-80
#5C5C5C
Deep neutral.
tertiary-solid-100
#1F1F1F
Near-black accent.
openai-hue-red
#ED6079
Hue ramp red — used in data viz and code syntax.
openai-hue-lime
#8FAC39
openai-hue-magenta
#C759AB
openai-hue-blue
#36A6D7
openai-hue-yellow
#E2A727
openai-accent-blue
#4DA3FF
Documented `--color-supply-accent-color` — link / interactive blue.

Mode role mappings

Light mode (15 roles)

accent → openai-accent-blue
accent-hover → openai-hue-blue
background → openai-white
border → secondary-solid-12
error → openai-hue-red
primary → openai-black
primary-hover → secondary-solid-80
success → openai-hue-lime
surface → secondary-solid-4
surface-elevated → openai-white
text-primary → openai-black
text-secondary → secondary-solid-60
text-tertiary → secondary-solid-44
warning → openai-hue-yellow
warning-hover → openai-hue-yellow

Dark mode (15 roles)

accent → openai-accent-blue
accent-hover → openai-hue-blue
background → openai-black
border → primary-solid-12
error → openai-hue-red
primary → openai-white
primary-hover → primary-solid-80
success → openai-hue-lime
surface → primary-solid-4
surface-elevated → primary-solid-12
text-primary → openai-white
text-secondary → primary-solid-80
text-tertiary → primary-solid-60
warning → openai-hue-yellow
warning-hover → openai-hue-yellow

Provenance

Source
https://openai.com/
License
Proprietary — All Rights Reserved
Attribution
OpenAI, OpenCo. — palette values captured from the deployed stylesheet on openai.com (--color-primary-*, --color-secondary-*, --color-tertiary-*, --color-hue-*, and --color-gray-* token families). OpenAI marks and logos are property of OpenAI.
Imported
2026-05-17
Notes
The token names primary/secondary/tertiary in OpenAI's design system are NOT brand-role names — they are neutral ramps where "primary" = light-on-dark, "secondary" = dark-on-light. The "solid" suffix indicates fully opaque hex; the non-solid tokens are alpha-on-base. This atom records the solid variants for swatch fidelity and maps them into role names per the branding-library schema.