Screenshot of Family

Family

family.co

The reference for warming up fintech with a cast of flat-illustrated blob characters scattered across a cream canvas (#fbfaf9), where a single near-black pill (#121212) is the only hard contrast.

Fintech flagship

Design tokens

background
surface
text
textMuted
accent
border
tone1
tone2
display
LFE Sans
body
Inter
mono

Do / Don't

Reference it for

  • Warm off-white page canvas #fbfaf9 instead of pure white, with stone surface #f2f0ed for cards and section blocks
  • Hero illustration strategy: two dense clusters of expressive flat-illustrated blob creatures (stick legs, dot eyes, smiles) flanking centred text, in vivid primaries (ember orange #ff3e00, meadow green #00ca48, sky blue #0090ff, sunburst yellow #ffbb26)
  • Centred hero headline at ~68px, tight -0.031em tracking, dark graphite #343433, set in two short lines for rhythm
  • Inset-border cards: a single 1px inset shadow at #f2f0ed instead of drop shadows, keeping every surface flat and tactile
  • One dark CTA pill (#121212) as the lone high-contrast element against the light field; secondary CTA as a light/outlined pill beside it
  • Pill geometry: 32px radius on buttons, fully-rounded (72px) on illustration containers; 10px radius on cards and inputs
  • Two-CTA hero row pairing an app-store download button with a 'Watch the Video' play button
  • Calm authoritative typography (Inter body) carrying the trust while the illustrations carry the play; let copy stay sober when imagery is loud

Do not copy

  • The custom 'Family' display typeface, it is proprietary
  • The specific blob-creature illustration cast (square-flower face, smiling clouds, the cat tile), a bespoke identity system
  • The Family wordmark and the bracketed-square logo glyph
  • Crypto/Ethereum-specific copy and product framing (Send to ENS, Swap, Back Up Now)
  • The exact primary-colour confetti density, lifting it wholesale reads as a Family knock-off rather than your brand