LightUp Cuba
Style Guide v1.2
One warm family (solar gold → terracotta) carries all warmth; blue is reserved for trust and action. Display is a bold geometric sans-serif; body is a classical serif for warmth and readability.
Color
Semantic tokens. Never hardcode hex — always reference the CSS variables via Tailwind classes so light and dark themes stay in sync.
Solar Gold
--solar-gold
Logo, highlights, primary icon badge
Terracotta
--terracotta
Urgency labels, live-impact accents
Trust Blue
--trust-blue
CTAs, links, 'cooling off' emphasis
Cream Card
--cream-card
Step cards, soft panel fills
Ink
--ink
Body text, headlines, footer
Typography
Display is Plus Jakarta Sans ExtraBold (800) for high-impact headlines. Body is Libre Caslon Text (serif) for warmth, credibility, and long-form readability.
Display — Plus Jakarta Sans ExtraBold
Aa
Three steps. No mystery.
weights: 700 · 800
Body — Libre Caslon Text
Aa
You fund a solar + battery kit. Our on-the-ground partner installs it in a household living through the blackouts.
weights: 400 · 700
H1 / 48px
Send solar power
H2 / 28px
Three steps. No mystery.
Body / 16px
A $250 donation funds one home solar + battery kit.
Label / 12px
Live Impact
Buttons & links
Primary action is always Trust Blue — 'giving' is the cooling counterpoint to the heat of the crisis.
Step cards
Icon badges graduate through the warm family, ending on Trust Blue at the 'proof' step.
You give
A $250 donation funds one home solar + battery kit.
We install
Our partner buys the kit and installs it in a Cuban household.
You see proof
You get a photo and install ID when the lights come on.
Impact panel
Live Impact
128
/ 500 kits funded
Roughly 512 people now have reliable evening light and phone charging.
Radius
4px — chips
14px — inputs
22px — cards
Full — buttons