Cloud
#FCFAF4Primary canvas
color.canvas.cloudFoundations / 01
Color
A clear role for every color. Azure leads; warm white gives it room.
03
Color
Warm white leads. Blue structures. Gold rewards.
The system is bright by default. Orange brings large-event energy; Azure carries primary interaction; Gold communicates premium value. Burgundy is not part of the system.
Brand communication composition guide
68%Cloud / Pearl16%Blue8%Gold5%Orange3%Ink
Use 68 Warm field / 16 Blue / 8 Gold / 5 Orange / 3 Ink only as an editorial starting point for campaign layouts. Aqua is an unallocated exception for verified Live states. Product interfaces follow hierarchy, state, and contrast—not a color quota.
Pearl
#F4EDDFElevated surface
color.canvas.pearlMist
#EAF2F7Data surface
color.canvas.mistAzure
#145BFFPrimary action
color.brand.azureCobalt
#0A3FB8Depth & focus
color.brand.cobaltGold
#D79B18Value & premium
color.brand.goldOrange
#FF6A1AEvent energy
color.brand.orangeAqua
#11BED0Live status only
color.brand.aquaInk
#10233DPrimary text
color.content.inkValue metal
105° · OKLab · 0 / 52 / 100VIP, membership, earned value
#FFF2B1 · #E3AE2D · #B77908Live signal
105° · OKLab · 0 / 100Verified Live states and realtime markers
#145BFF · #11BED0Event energy
105° · OKLab · 0 / 100Launch moments and limited campaigns
#FFB11B · #FF6A1APearl field
105° · OKLab · 0 / 100Large backgrounds and quiet depth
#FCFAF4 · #F4EDDFUse OKLab for even lightness and controlled midpoints.
Use one gradient field per composition, never as a numeric scale.
Put reading text on a solid semantic surface or measured scrim.
Add subtle noise only to large raster fields to control banding.
Approved pairings
Contrast is part of the brand.
Ink on Cloud15.13:1 · body + editorial
White on Azure5.29:1 · primary action
Ink on GoldPremium action
Ink on OrangeEvent emphasis
Use when a darker blue field needs maximum text contrast.
Both fail as normal text on White. Use Ink on bright fills.
Aqua signals Live; it is never body text on a light surface.