How PlanJolly looks, speaks and feels
PlanJolly is a wedding planning app for couples – one plan, two seats. The interface is editorial and calm: serif headlines, warm surfaces, and soft shadows in place of hard lines.
This site is the reference for every token, rule and word choice in the app. Each value is generated from the app's own theme.ts, and the site is built from the same tokens it documents.
Three rules carry the whole system
The No-Line rule
Borders are replaced with ambient drop shadows and tonal fill shifts – never hard strokes. The one exception is the ghost border: a 20–30% primary stroke, reserved for inputs and interactive states.
Two-tier headings
Noto Serif carries the moments – display titles and editorial accents. Manrope does the work – body, labels, buttons. Two families, nothing else.
AAA contrast
Body and secondary text hold WCAG AAA contrast on every app surface. Secondary text was darkened specifically to clear 7:1 – calm never means faint.
Find your way in
Colour
Primitives, semantic tokens and the 15-category palette – with live contrast ratios.
Typography
Noto Serif and Manrope, the full type scale as live specimens, and the platform rules.
Spacing & radius
The 4-point spacing scale and the corner radius set, from chips to pills.
Elevation
The ambient shadow recipe, six shadow tokens, and the ghost border.
Motifs & illustration
Hearts, sparkles, dividers and the mascot – with the rules for using them.
Logo & brand
Wordmark, lockups and the calendar-heart mark, on cream and on navy.
Voice & tone
The clued-up friend: do/don't pairs from real app copy, and the words that never appear.