Merlin. Handwritten margin notes on white paper.
- AI
- Light theme
- 14 colors
- 1 typeface
Merlin uses a hushed, paper-like productivity language: a warm off-white canvas, flat white surfaces, a single vivid green accent that makes the primary action feel like a green light turning on, and soft pastel atmospheric gradients reserved for the page's top and the product backdrop. Type is bold and confident at display sizes but quiet at body sizes — Inter carries the entire voice in one family, letting weight and tracking do all the work. The system feels hand-touched: handwritten green annotations in a script style sit beside machine-clean sans-serif, bridging warmth and product precision. Components stay close to the page — thin hairlines replace heavy elevation, pills replace boxes, and the nav floats as a capsule rather than anchoring as a bar.
Merlin design system
Brand1
Green action color for filled buttons, selected navigation states, and focused conversion moments
Accent2
Inline links, highlight text within body copy
Atmospheric top-of-page gradient — soft sky blue bleeding down into warm gray, the page's only colored light source
Neutrals11
Primary headings, strong borders, icon strokes — maximum contrast
Body text, secondary borders — near-black that softens display ink
Icon fills/strokes, secondary borders, muted interface elements
Muted headings, link borders, tertiary text
Light borders, disabled text, subtle separators
Divider lines, light background washes
Card borders, link underlines, soft outlines
Lightest borders, soft card outlines, gentle separators
Page canvas — the warm off-white ground the entire page sits on
Subtle warm-tinted surface for accent cards or highlighted zones
Card surfaces, product mockup backgrounds, floating nav capsule
Try a pairing
Pick any two colors from the palette to check whether text stays readable on top.
Aa
Ink Black on Signal Green
9.46 : 1 contrast
- Body textPasses AA 4.5
- Large textPasses AA 3
- StrictPasses AAA 7
