Goodmorrow design system
From the Goodmorrow template.
Included with Everything
Colour
Type
- Besleydisplay · 600, 700 · SIL Open Font License 1.1
- Rethink Sansbody · 400, 500, 620, 650, 680, 700, 720 · SIL Open Font License 1.1
- Display107 / 50px · 700What people come back for
- H259 / 40px · 700Out of the oven at 7:00
- H319 / 16px · 720Three taps, no queue.
- Lead19 / 18px · 400Goodmorrow: coffee roasted and bread baked on Canal Street, poured in three shops across Northam.
- Body15 / 18px · 400Order ahead, find a shop, book catering.
- Small14 / 14px · 400No API keys: it all runs in the browser.
- Eyebrow12 / 12px · 500ORDER AHEAD
Components
GoodmorrowOrder aheadLocationsCateringWholesaleOrder ahead
Order ahead
On a date
ORDER AHEAD
Three taps, no queue.
Order ahead, find a shop, book catering.
It started with one oven and a borrowed roaster.
No API keys: it all runs in the browser.
Shape and motion
- sm · 10px
- md · 14px
- lg · 22px
- pill · 9999px
- shadow sm
- out ·
cubic-bezier(.2, .8, .2, 1) - in-out ·
cubic-bezier(.65, 0, .35, 1) - fast · 250ms
- base · 450ms
- slow · 1200ms
Exports
- DESIGN.md
DESIGN.md22 KBEverything - CSS variables
tokens.css5 KBEverything - Tailwind v4
tailwind.css6 KBEverything - shadcn/ui theme
shadcn.css5 KBEverything - Figma variables
figma-variables.json28 KBEverything - Webflow variables
webflow-variables.json9 KBEverything - W3C tokens (JSON)
tokens.json17 KBEverything
Everything unlocks every format of every system in the app and through the MCP server. Ask your agent for get_design_system("goodmorrow") with the MCP server.
- Source
- Goodmorrow template
- Palette
- Sanzo Wada 173: Lemon Yellow, Madder Brown, Turquoise Green
- Fonts
- Besley (OFL 1.1), Rethink Sans (OFL 1.1)
- Themes
- Light and dark
- Contrast
- Text 16.38:1 · muted 6.2:1
Inside DESIGN.md
- At a glance
- Setup
- Colour
- Typography
- Layout and spacing
- Shape and depth
- Motion
- Components
- Voice and copy
- Do and don’t
- Tokens