Internal sandbox · noindex
Design System
Pick the executive blue + silver + egg-yolk palette. Click candidates to promote, paste hex values to try your own, copy CSS when you’re happy. Phase 1 wires the picked palette into globals.css.
Candidates
Click any swatch to promote it to the active palette below.
Navy / Primary
Silver / Secondary
Yellow / Accent (egg-yolk)
Try your own
Paste any 6-digit hex value. Live preview re-renders immediately.
Live preview
Five tiles render with the active palette. Eyeball test against your branding.
Minnesota roofing, done right.
Free inspections and written estimates within 48 hours.
CTA buttons
Roof Replacement
Full residential replacement with architectural shingles, metal, or specialty materials.
Learn more →Central Minnesota, along the Rum River.
- Roof Replacement
- Roof Repair
- Storm Damage
- (970) 555-0199
- 510 South Rum River Drive, Princeton MN
Current tokens
Live values from app/globals.css. Click any swatch to copy. Phase 1 will overwrite these with the palette you pick above.
Brand colors
Ember usage examples
Live demos of --color-ember(#e8611a) used as highlights, borders, tags, and underline accents. Marigold remains the CTA color; ember is for warm accents that don’t compete for the click.
Heads up
Insurance deadline: file within 12 months of the storm event.
43
Communities
Text colors
Gradients
Typography
Display: Plus Jakarta Sans (owner pick, Stage 8 2026-05-08). Body: Inter. Both load via next/font; the display font fills --font-display and Tailwind’s font-display utility class.
Display — Plus Jakarta Sans (--font-display)
Display 5xl / 800
Heading 4xl / 700
Heading 3xl / 700
Heading 2xl / 600
Subhead xl / 600
Body — Inter (--font-body)
Body xl / 400 — Minnesota roofing
Body base / 400 — Minnesota roofing from Central Minnesota — Twin Cities Metro, St. Cloud, Brainerd Lakes, and Duluth. Free inspections, written estimates within 48 hours.
Caption sm / 400 — Licensed MN contractor, fully insured crews.
Micro xs / 400 — Footnote / fineprint.
All four are open-source via Google Fonts and load via next/font.