PUBLIC REFERENCE
Mercury
Mountain Top Command Center
Colors
Mercury Blue
#5266eb Primary CTA buttons — the single, vivid accent in a muted palette, focusing user action.
Ghost Blue
#cdddff Secondary button backgrounds, hover states — a desaturated, ethereal blue suggesting interaction.
Deep Space
#171721 Outermost page background layer, providing depth.
Midnight Slate
#1e1e2a Primary page and section backgrounds.
Graphite
#272735 Subtle button backgrounds and interactive surfaces.
Lead
#70707d Borders, dividers, subtle UI accents.
Starlight
#ededf3 Primary text color for headlines, body, and navigation.
Silver
#c3c3cc Secondary text, footer copy, disabled states.
Pure White
#ffffff Text on primary CTA buttons (#5266eb).
Do
- Use 'arcadiaDisplay' at a light weight (360) for all major headlines to maintain an airy, sophisticated tone.
- Reserve the 'Mercury Blue' (#5266eb) accent exclusively for primary, action-oriented CTAs.
- Employ the deep neutral palette (#171721, #1e1e2a) for all backgrounds to create a focused, immersive environment.
- Utilize extreme corner radii (32px, 40px) for all primary and secondary buttons, creating a signature 'pill' shape.
- Maintain high contrast with 'Starlight' (#ededf3) text on dark backgrounds for all primary content.
- Use generous vertical spacing (80px+) between content sections.
- Differentiate interactive list items with a simple 1px bottom border in 'Lead' (#70707d).
Don't
- Don't use 'Mercury Blue' (#5266eb) for text, backgrounds, or decorative elements.
- Don't use heavy font weights (>530) for any typography.
- Don't apply shadows for elevation. Use color and opacity shifts instead.
- Don't introduce new saturated colors. The palette is monochrome plus one blue accent.
- Don't use small corner radii on buttons. They should always be pills.
- Don't use 'Pure White' (#ffffff) for body text; reserve it for text on the primary blue CTA.
- Don't create dense, cluttered layouts. Prioritize breathing room.