Courthand design system
From the Courthand template.
Included with Everything
Colour
Type
- Bodoni Modadisplay · 400 · SIL Open Font License 1.1
- Source Serif 4body · 400, 600 · SIL Open Font License 1.1
- Intersupport · 400, 500, 600 · SIL Open Font License 1.1
- Display107 / 48px · 400A first read in thirty-eight seconds.
- H256 / 40px · 400One associate. Five things it does all day.
- H332 / 23px · 400Notes on contracts, craft and AI.
- H415 / 15px · 600Notes on contracts, craft and AI.
- Lead17 / 17px · 400Courthand reads every clause against your firm’s playbook, marks what moves risk and drafts the redline in your house style.
- Body16 / 15px · 400Courthand does the first read and the first draft.
- Small12 / 12px · 500Courthand reads every clause against your firm’s playbook, marks what moves risk and drafts the redline in your house style.
- Eyebrow13 / 13px · 500§ THE READ
Components
CourthandCUSTOMERSPRICINGJOURNALCOMPANYBOOK A DEMO
BOOK A DEMO
Learn more
Read more
§ THE READ
Notes on contracts, craft and AI.
Courthand does the first read and the first draft.
Shape and motion
- sm · 4px
- md · 6px
- lg · 8px
- shadow sm
- in-out ·
cubic-bezier(.7, 0, .2, 1) - out ·
cubic-bezier(.19, 1, .22, 1) - fast · 350ms
- base · 800ms
- slow · 1300ms
Exports
- DESIGN.md
DESIGN.md23 KBEverything - CSS variables
tokens.css5 KBEverything - Tailwind v4
tailwind.css6 KBEverything - shadcn/ui theme
shadcn.css5 KBEverything - Figma variables
figma-variables.json29 KBEverything - Webflow variables
webflow-variables.json9 KBEverything - W3C tokens (JSON)
tokens.json18 KBEverything
Everything unlocks every format of every system in the app and through the MCP server. Ask your agent for get_design_system("courthand") with the MCP server.
- Source
- Courthand template
- Palette
- Sanzo Wada 94: Ivory Buff, Dusky Green
- Fonts
- Bodoni Moda (OFL 1.1), Source Serif 4 (OFL 1.1), Inter (OFL 1.1)
- Themes
- Light and dark
- Contrast
- Text 16.22:1 · muted 12.42: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