Storefront

Site footer

Five link columns and the newsletter on paper. Links are set in Garamond, the one place the interface uses the serif, so the footer reads as fine print.

components/coach/blocks/site-footer.tsx

Preview

Live, on the prototype's content. Switch to mobile to see it at 390px.
1440pxOpen

Built from

Anatomy

  1. 01Five columns: headings in bold caps, links in Garamond
  2. 02Newsletter with disclaimer and networks
  3. 03Legal row, caps, centred
  4. 04Copyright on white

Usage

components/coach/blocks/site-footer.tsx
import { SiteFooter } from "@/components/coach/blocks/site-footer";

<SiteFooter />

Props

PropTypeDefaultDescription
classNamestringMerged last. For spacing around the block, not for restyling it.

Guidance

Do

  • On mobile, keep only the newsletter, networks and legal list; the header menu carries the rest.

Where it's used