Caffe Design
www.caffe.designAn Italian "design gang" community-magazine fronted by a hand-drawn one-eyed coffee-cup mascot — bubblegum-pink canvas, a literal animated preloader as the brand voice, GT Haptik sans paired with Argent Pixel CF italic for headline accents.
Design tokens
- display
- GT Haptik
- body
- GT Haptik
- accentItalic
- Argent Pixel CF
- fallback
- Times
- mono
- (none)
Do / Don't
Reference it for
- rgb(255, 179, 212) bubblegum pink page surface — confident chromatic background, not a near-white
- Hand-drawn full-colour mascot dropped on the page without a card frame, shadow, or rectangle
- Literal animated preloader as the brand experience — five-dot progress indicator below the mascot, coral-red lit state
- rgb(255, 84, 90) coral-red as a single-use "active state" accent — only the lit preloader dot wears it
- Pure black rgb(0, 0, 0) typography (639 hits) — near-total text discipline on a chromatic page
- GT Haptik (Grilli Type, same foundry as Koto) at 5 weights (300, 400, 500, 700 + MediumRotalic italic variant) — full sans system
- Argent Pixel CF italic as headline accent serif — gives editorial phrases their *kick* (e.g. *ascoltami!*)
- Times as system fallback — old-school, intentional, magazine-like
Do not copy
- The coffee-cup-with-legs cyclops mascot illustration — it is the Caffè Design IP
- The phrase *"Io sarò la tua guida, ascoltami!"* — it is the literal mascot voice line
- The phrase *"la tua gang di Designer preferita"* / "gang of designers" framing
- The caffè / design two-line stacked wordmark
- The Italian-language site copy verbatim — pick the brand's actual market language
- The GT Haptik bespoke font commission unless the brand can licence Grilli Type
- The Argent Pixel CF face exactly — substitute with a freely-licensable italic serif if needed
- The exact rgb(255, 179, 212) pink hue at full surface — pick a brand-specific chromatic
Signature moves
confident chromatic full-surface canvas
the whole page sits on a bubblegum-pink surface with pure-black type discipline (no near-white), making colour the brand statement rather than an accent.
hand-drawn mascot dropped frameless on the page
a full-colour hand-drawn mascot sits directly on the canvas with no card, shadow or rectangle around it, reading as crafted illustration not stock.
literal animated preloader as the brand experience
a hand-authored animated preloader (five-dot progress under the mascot, one coral lit dot) is the brand voice, built from 7 keyframes (anim, kickin, pulse, etc.) with no animation library and a disciplined all 0.3s ease workhorse transition.
Related references
Cyphr
strongCreative Studio
The reference for venture-studio portfolios that flex through monumental condensed type, a single blue I-beam cursor accent, and a venetian-blind slat hero that fragments a single image into a column-rhythmic curtain.
Abby Wilson Therapy
strongOther
A boutique therapist for "anxious, high-achieving women" who reassures by being polished and specific - a warm sand-and-charcoal editorial system, a Calluna serif voice, named specialties and a clearly walked process that says "I understand exactly who you are and how this works".
Alche
strongCreative Studio
The reference for Japanese virtual-character + immersive experience studios — Astro v5 build, neon yellow-green accent, 5-font multi-language system, KizunaAI case study.
Analogue
strongCreative Studio
a "seriously playful" brand-and-motion studio that wears its personality as type, a wonky multi-alternate ANALOGUE wordmark, emoji and icon glyphs set inline in the copy, a candy-pink accent on white, and a GSAP-driven box of tricks (mexican-wave letters, glitches, bounce, float) kept just on the right side of chaos.