Fairsky design system
From the Fairsky template.
Included with Everything
Colour
Type
- Nunitodisplay · 300, 500, 700 · SIL Open Font License 1.1
- Figtreebody · 400, 500, 600, 700 · SIL Open Font License 1.1
- Display107 / 52px · 300Ask once. It follows through.
- H195 / 48px · 300Ask once. It follows through.
- H256 / 40px · 300One assistant, six kinds of help.
- H329 / 24px · 600Your Wednesday, cleared.
- Lead23 / 20px · 400Fairsky is the AI assistant that clears your day.
- Body19 / 16px · 400It plans, books, pays and replies, and asks before anything leaves your hands.
- Small14 / 14px · 400Fairsky plans your days, answers the easy mail and chases the errands.
- Eyebrow16 / 16px · 500Section label
Components
FairskySkillsPricingStoriesGet the appGet the app
Get the app
Not now
Edit
Your Wednesday, cleared.
It plans, books, pays and replies, and asks before anything leaves your hands.
Shape and motion
- sm · 14px
- md · 20px
- lg · 32px
- pill · 9999px
- shadow sm
- shadow md
- in-out ·
cubic-bezier(.65, 0, .35, 1) - out ·
cubic-bezier(.22, 1, .36, 1) - fast · 350ms
- base · 800ms
- slow · 1300ms
Exports
- DESIGN.md
DESIGN.md24 KBEverything - CSS variables
tokens.css6 KBEverything - Tailwind v4
tailwind.css6 KBEverything - shadcn/ui theme
shadcn.css5 KBEverything - Figma variables
figma-variables.json30 KBEverything - Webflow variables
webflow-variables.json9 KBEverything - W3C tokens (JSON)
tokens.json19 KBEverything
Everything unlocks every format of every system in the app and through the MCP server. Ask your agent for get_design_system("fairsky") with the MCP server.
- Source
- Fairsky template
- Palette
- Sanzo Wada 333: Burnt Sienna, Lemon Yellow, Cobalt Green, Blue
- Fonts
- Nunito (OFL 1.1), Figtree (OFL 1.1)
- Themes
- Light and dark
- Contrast
- Text 16.57:1 · muted 6.46: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