← Palettes · [email protected]

xAI

xAI's brand palette as captured from the live site (x.ai). The brand is stark dark-first by construction: a pure-black "Void" canvas (#0A0A0A) with pure-white inverse, a calibrated five-stop neutral ramp for surfaces and quiet emphasis, and a deliberately minimal set of accent colors. The brand reads as engineering-spec minimal — closer to a research paper than a marketing site — with the white-on-black X mark as the dominant visual signature. Two restrained signature accents appear in the live CSS — a bright lime "Spark" (#75FBA6) used for active state and a deep ember "Pulse" (#FF6308) used for the Grok product mark — but the brand's identity is defined first by its absence of color, not its presence.

25 swatches 15 light roles 15 dark roles xaiaigrokbranddark-firstmonochromeminimal

Swatches

void

#0A0A0A

Primary dark canvas — xAI's documented near-black.

void-deep

#0C0C0B

Deepest near-black — gradient endpoint.

void-pure

#000000

Pure black for hero artwork and the X mark ground.

ash-100

#171717

Subtle elevated surface on Void canvas.

ash-200

#18181B

Borders / quiet dividers on Void canvas.

ash-300

#262626

Mid surface — card background on Void.

ash-400

#27272A

Hover surface on Void canvas.

ash-500

#2B2B2B

Elevated card surface.

ash-600

#404040

Tertiary text on Void canvas.

ash-700

#525252

Secondary text on Void canvas.

ash-800

#545454

Mid-tone neutral.

ash-900

#696969

Tertiary text — quietest readable on Void.

paper-pure

#FFFFFF

Pure white — light canvas and on-Void foreground.

paper-warm

#FEFEFE

Near-white — soft inverse.

paper-cream

#F8F7F5

Warm cream — quiet surface on light canvas.

spark

#75FBA6

Bright lime spark — active state and live-data accent.

pulse

#FF6308

Ember orange — Grok mark and high-attention accent.

pulse-soft

#FFA07A

Soft ember tint for hover states.

link-blue

#2563EB

Documented link color in long-form prose.

ember-warning

#F5AB35

Marigold warning state.

ember-error

#D91E18

Deep red error state.

ink-body

#374151

Body text on Paper canvas — prose-body token.

ink-heading

#111827

Heading text on Paper canvas.

ink-quiet

#6B7280

Tertiary text on Paper canvas.

ink-border

#E5E7EB

Border on Paper canvas.

Mode role mappings

Light mode (15 roles)

accent → link-blue

accent-hover → link-blue

background → paper-pure

border → ink-border

error → ember-error

primary → void

primary-hover → ash-300

success → spark

surface → paper-cream

surface-elevated → paper-pure

text-primary → ink-heading

text-secondary → ink-body

text-tertiary → ink-quiet

warning → ember-warning

warning-hover → pulse

Dark mode (15 roles)

accent → spark

accent-hover → spark

background → void

border → ash-200

error → ember-error

primary → paper-pure

primary-hover → ash-600

success → spark

surface → ash-100

surface-elevated → ash-300

text-primary → paper-pure

text-secondary → ash-900

text-tertiary → ash-700

warning → ember-warning

warning-hover → pulse

Provenance

Source: https://x.ai/
Attribution: X.AI Corp — palette values captured from the deployed stylesheet on x.ai (Tailwind-class neutral ramp, gradient stops, and rendered accent colors). xAI, Grok, Colossus, and associated marks are property of X.AI Corp.
Imported: 2026-05-18
Notes: Derived from live site CSS at https://x.ai/ on 2026-05-18 (fetched via web.archive.org snapshot dated 2026-01-01 because x.ai serves a 403 to unauthenticated programmatic clients); no public brand guide located. The proprietary brand display face universalSans / universalSansDisplay is declared on x.ai via @font-face but is not publicly distributed; the proprietary GeistMono distribution is also declared. This atom records the live-site canvas (#0A0A0A), neutral ramp, and the two accent literals observed in CSS (#75FBA6 spark-green and #FF6308 pulse-orange). The brand's dominant posture is monochrome — the accents appear sparingly.