v1.02026 edition16 sections
The Werklist
design system.
One source of truth for every Werklist surface. marketing, product, WerkOS, decks, social. Built to match jobs.werklist.com’s canon, typeset in Satoshi, governed from brand@werklist.com.
- Owner
- brand@werklist.com
- Canon
- jobs.werklist.com
- Stack
- Next.js 16 · Tailwind v4
- Typeface
- Satoshi by Fontshare
- Updated
- 21 Apr 2026
Every token you see here is already consumed byjobs.werklist.comin production. Changes here propagate to the PDF deck, WerkOS, and every downstream surface by design.
Contents
16 · sections
Read straight through in 20 minutes. Each section stands alone.
- 00
Foundation
Purpose, vision, mission, values, culture, positioning.
- 01
Logo
Wordmark, logomark, lockups, clear space, don'ts.
- 02
Color
Brand, neutrals, semantic, contrast.
- 03
Typography
Satoshi specimen, scale, and tracking.
- 04
Grid & Layout
Base 4, spacing scale, containers, breakpoints, radii.
- 05
Iconography
20×20 hand-rolled SVGs, stroke 1.75.
- 06
Imagery
Two-mode photography system; dark-cinematic reserve.
- 07
Motion
150 to 300ms, cubic-bezier(0.4, 0, 0.2, 1). Restraint.
- 08
Voice & Tone
Direct. Trust-first. Unhyped. A tone matrix.
- 09
Product UI Bridge
One system, three surfaces, three tempos.
- 10
Components
Button, Card, Input, JobCard, AI callout, Chip.
- 11
Patterns
Marketing hero, product hero, testimonial, CTA.
- 12
Applications
PDF deck, social, slides.
- 13
Accessibility
WCAG 2.2 AA floor. Focus ring. Reduced motion.
- 14
Governance
Source of truth, versioning, changelog, ownership.
- 15
Downloads
Logo SVGs, tokens JSON, CSS variables, PDF deck.
Positioning
Werklist is the global work infrastructure. a tech-enabled recruitment network that verifies both sides of the hire and handles the full employment lifecycle from sourcing to settlement.
Purpose
To bring simplicity to global work by eliminating complexity and uncertainty for both workers and employers.
Mission
To design the global work infrastructure that redefines how the world works.
Vision
To become the first thought associated with work for both workers and employers, and to enable a world where they focus on work, not employment.
Primary color
#1863DC
Werklist blue
Neutral ramp
11
Steps
Typeface
1
Satoshi · 5 weights
Canonical radii
9
Per role