Jiffi
www.jiffi.cothe home brand - Jiffi's own site, a punchy "chaos to clarity" tech-agency story told through GSAP-driven scroll motion, the Simula + Satoshi type system and the navy/blue/yellow palette.
Design tokens
- display
- Simula
- body
- Satoshi (Satoshi Variable)
- mono
- -
Do / Don't
Reference it for
- The Jiffi brand in practice: navy/blue/yellow palette, Simula + Satoshi, the Chaos/Clarity character world.
- Punchy, plain-spoken agency voice - short declarative sentences, anti-jargon.
- GSAP + Lenis scroll storytelling at agency-craft level.
- A migration reference: how Jiffi's current Webflow motion should be rebuilt on Astro.
Do not copy
- This is Jiffi's own identity - other Jiffi *client* builds must not look like jiffi.co. It is the house brand, not a template.
- The Webflow build itself - this skill's job is to rebuild this quality natively on Astro (see astro-rebuild.md).
Signature moves
chaos-to-clarity scroll storytelling
a punchy agency story is told through GSAP + Lenis scroll motion at agency-craft level, with a character world and plain-spoken short declarative copy.
Simula + Satoshi navy/blue/yellow system
the Simula display plus Satoshi body type system on the navy/blue/yellow palette (accent #599cff) across a 12-112px scale with full-round pills (radius 1600px) is the brand in practice.
Related references
Marshall White
strongReal Estate
a premium Melbourne real estate agency rendered as a restrained editorial object: deep navy ink (#00101F) on white, a single refined sans (Untitled Sans) with a Georgia/Cigars serif accent, full-bleed property photography and almost no radius, so the work and the wealth speak quietly.
Medwest
nicheHealth
a clinical-but-warm physiotherapy site built on one confident teal (#00A09A), oversized outlined display headlines laid over duotone black-and-white treatment photography, with GSAP-driven reveals on a long, soft easing curve.
Method
nicheSaas Product
The reference for QuickBooks-niche B2B CRM — clean deep-navy + royal-blue conservative B2B design with yellow-underline accent and customer-photo-driven testimonials.
Mishcon De Reya
flagshipProfessional Services
a top London law firm that ditches the navy-and-columns cliche for a dark, editorial, almost magazine-grade site, near-black grounds, full-bleed photographic heroes, a single burnt-orange accent and clean Helvetica Now type, anchored by a prominent "How can we help you?" search bar.