Sublime
sublime.appThe reference for hanging a monumental black geometric-sans headline on a pure-white gallery wall, then letting one photoreal 3D object (a mossy sculpture) crash up into the type as the only colour in the room.
SaaS Product flagship
Design tokens
background
surface
text
textMuted
accent
border
tone1
tone2
- display
- Control Upright
- body
- Control Upright
- mono
Do / Don't
Reference it for
- Extreme display type: two-line headline in a heavy geometric grotesque, tight tracking, roughly 120 to 142px, pure black #000000 on paper white #ffffff, doing all the structural work with no eyebrow or kicker
- One hero object, photoreal: a single collaged 3D render (weathered stone + moss + tiny white flowers) that overlaps and partially occludes the headline baseline, ignoring the grid
- Colour discipline: a near-achromatic page where the ONLY saturated notes are the moss green in the object and a single lime-green CTA, everything else black, white and warm greys
- Bright lime pill CTA (~#a3f065) sitting next to a plain text login link, top-right, tiny, so the button is the loudest small element on screen
- Centred composition with aggressive whitespace: headline top-centre, object mid, a three-line grey subheading (save one thing / discover a hundred / more) anchored dead-centre at the base
- Small floating labels as texture: a light-grey pill tag reading a filename (headinthecloudss.txt) and a monarch butterfly dropped in as a collage accent near the type
- Two-radius system: crisp 5px on functional controls and cards, full 999px pills for tags and the CTA
- Flat elevation: no drop shadows anywhere, depth comes only from off-white surface steps (paper to bone to pale washes) and hairline fog-grey borders
Do not copy
- The sublime lowercase wordmark and its little swallow/bird mark
- The specific mossy-stone-sculpture render (a signature commissioned object, not a stock move)
- The monarch butterfly collage accent
- The headinthecloudss.txt filename tag and its exact copy
- The exact the knowledge tool that sparks creativity headline wording
- The literal Times-New-Roman-for-body serif/sans collision as a house signature (borrow the tension, not the pairing)