Hearth

Warm local service: forest green, warm paper, trust first.

Small business/hearthlight + dark

Exemplar: Squarespace local-business templates

Studied from service-business sites. Original tokens and copy; no assets copied.

Live tokens

Colors

bg
#FBFAF6

surface
#F2F1E9

surface-alt
#E8E7DC

text
#23271F

text-muted
#5C6152

border
#DEDCD0

primary
#2F5D3A

on-primary
#FFFFFF

accent
#8A6414

on-accent
#FFFFFF

Type

Directionxxxl · 3.75rem

Design systemxxl · 2.75rem

Conversion notesxl · 1.875rem

Section headinglg · 1.375rem

Body copy for the pagemd · 1rem

Supporting textsm · 0.875rem

Meta labelxs · 0.75rem

Pack recipe 0123'Fraunces', 'Iowan Old Style', Georgia, serif

Pack recipe 0123'Geist', 'Inter', system-ui, sans-serif

Pack recipe 0123'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace

Spacing, radius, shadow

xs 0.25rem

sm 0.625rem

md 1.125rem

lg 1.75rem

xl 3rem

xxl 5rem

sm 6px

md 12px

lg 16px

Component samples

Home repairs, done right

Serving the north side since 2009.

Place and tenure build trust.

Same-week slots

Your postcode

We check coverage first.

Boiler service

Full check, certificate, and report

From $120

Recipe

Apply the rules, place the patterns, then tune the conversion notes against the rubric.

Rules

Ground the page in warm paper with forest green actions.
Show the phone number in the header at all widths.
Use the soft radius scale for photos and cards.
Put real photos of people and place, never stock abstractions.
Write like a person at the counter: plain words.

Patterns

Hero with the service, the area served, and the phone action.
Reviews block with names and towns.
Services list with plain-language price ranges.
Booking form: date, service, contact.

Conversion notes

Put 'same-week appointments' near the call button.
Show the guarantee line under the booking form.
Answer price questions on the page, not by phone only.

See this pack on your site.

Attach your URL. The audit maps your gaps to Hearth or a better-fit pack.