Style guide

Warm Paper / Reader Board

A content-first system for SignBoard Planner. Built on cream paper, charcoal ink, deep terracotta, and a muted gold supporting tone — with a literal letterboard accent for the sign mockup itself.

01 — Color

Palette

Paper
--sb-paper
#F6F1E7
Paper soft
--sb-paper-soft
#EFE7D6
Card
--sb-card
#FFFEFB
Rule
--sb-rule
#E4DAC4
Ink
--sb-ink
#1F1D18
Ink 2
--sb-ink-2
#3D3A33
Ink 3
--sb-ink-3
#6B6558
Ink 4
--sb-ink-4
#9A9485
Accent (terracotta)
--sb-accent
#703A2B
Accent soft
--sb-accent-soft
#F3E3D9
Gold
--sb-gold
#B08A3E
Leaf (state: fits)
--sb-leaf
#44604A

Accent is for primary action only — Print Setup Sheet, key navigation states. Gold is editorial: kickers, occasion tags. Leaf is reserved for affirmative state.

02 — Type

Pairing

FRAUNCES · DISPLAY
Find a sign that actually fits.
Section heading — 32 / 500
Subhead — 22 / 500
INTER · BODY & UI

Body copy is 18px / 1.55. Generous, never small. Lean into legibility over density.

Secondary copy — 15px, ink-3.

Eyebrow / kicker — 12 / 600 / tracked
OSWALD · READER-BOARD LETTERS
HE IS RISEN INDEED
Used only inside the SignMockup component and its echoes. Never page UI.
03 — Sign mockup

The visual centerpiece

ST. JAMES UNITED METHODIST
HEISRISEN
INDEED
—EASTER—
SIZE · MD
ST. JAMES UNITED METHODIST
COMEAS
YOUARE
SIZE · SM (CARD)
04 — Components

Core kit

Buttons
Tags & state pips
Easter Reverent Spring Fits your sign Tight fit Won't fit
Inputs
Logo / wordmark
05 — Voice & content

Tone of voice

Yes
  • "Find a sign that actually fits."
  • "Print Setup Sheet"
  • "Won't fit your sign — try one of these"
  • "Letters you'll need"
No
  • "Download PDF" — call it Setup Sheet
  • "category_id" / database language
  • "AI-powered" — never lead with this
  • Urgency, scarcity, popups