Mindset & Marketing
Sage, blush, gold, everywhere.
The full brand palette — sage & olive greens, warm ecru & beige, blush & rose accents, with charcoal text and gold highlights — applied across your home, auth, and Shift Map screens.
Sage#7C8B6D
Olive#55624A
Ecru#F7F3EC
Beige#E7D8C2
Blush#F6B5C1
Rose#E08FA2
Charcoal#2F2F2F
Gold#D4AF37
The Shift
Sign inStart
Purpose · Alignment · Mindset
The Mindset
and Marketing Shift
A daily coach for purpose and profit.
Begin
Learn more
gold-touch details
Purpose
Alignment
Mindset
Home screen
Landing hero, pillars, and feature preview
The Shift
Mindset + marketing, daily.
Six pillars. One calm practice.
$12/mo membership
Purpose·Alignment·Action
Create your account
Create your free account.
you@example.com
••••••••
Create account
or continue with Google
Auth screen
Sign-up / sign-in split panel
Your journey
The Shift Map
27%
Stage 1
Discover
2
Stage 2
Alignment
3
Stage 3
Beliefs
4
Stage 4
Action
Success Profile
1 of 6 stages complete
Shift Map
Six-stage journey with progress
Design System
Color tokens
Each palette color is exposed as a CSS token in src/styles.css and mapped to specific UI elements across the app.
Primary#E08FA2
--primary / --rose
Primary action
CTA buttons, active nav, key highlights
Soft#F6B5C1
--accent / --blush
Soft accent
Badges, gradient starts, hover tints
Supporting#7C8B6D
--sage
Supporting green
Secondary chips, illustrations, sprigs
Deep#55624A
--olive
Deep green
Section headings, icons, quiet emphasis
Highlight#D4AF37
--gold
Highlight
Level / rewards, membership, decorative rules
Page#F7F3EC
--background / --cream
Page background
App canvas, screen background
Surface#E7D8C2
--secondary / --beige
Surface
Cards, progress tracks, muted panels
Text#2F2F2F
--foreground / --charcoal
Text
Body copy, headings, iconography
Live element mapping
Blush badgeSage chipOlive chipGold highlightBeige surface
Rose
Sage
Gold
Accessibility
WCAG contrast checker
Pick a text and background token. Ratio uses WCAG 2.1: AAA ≥ 7, AA ≥ 4.5, AA Large ≥ 3.
The quick brown fox jumps.
Body copy at 14px — this is how paragraph text will read on this surface.
Charcoal on Ecru
Text color
Background
Full matrix
| Text ↓ / BG → | Ecru | Beige | White | Blush | Rose | Sage | Olive | Gold | Charcoal |
|---|---|---|---|---|---|---|---|---|---|
Charcoal | |||||||||
Ecru | |||||||||
White | |||||||||
Olive | |||||||||
Rose ink | |||||||||
Gold ink | |||||||||
Rose | |||||||||
Gold |