Colors
The Composio color system. Click any value to copy it to your clipboard.
The brand is one blue on both surfaces: #51a2ff. It does not flip. It clears contrast on the dark page at 7.27:1 and on the dark card at 6.32:1, so a second hue was never needed. On DEV every step, hover and active included, is that same blue; only FOR YOU darkens hover and active. The retired dark value was 1.75:1 against the page and effectively invisible.
The surfaces below are the core system for product UI; blue is a spot colour on top of them, not a building material. For expressive, broad-brand moments — covers, hero art, social — reach for the gradients at the bottom.
Brand & Surfaces
Semantic
Reserved for their literal meaning — never use as a generic accent. Each value is mode-paired (FOR YOU / DEV).
Persona Accents
Specialty — outside the brand. Used only to distinguish personas on the learning surface; not part of general UI color.
Gradients
Expressive, broad-brand moments — covers, hero art, social. The Core Gradient is the default; click any value to copy the CSS.