The Azaria system
for rare work
Everything below is derived directly from the design of this site, documented for clients, partners and future collaborators. It explains how we look, how we sound, and the rules that keep the brand coherent across every deliverable.
The mark
A single luminous point — the drop that holds an ocean. The wordmark is lowercase, set in Space Grotesk.
Usage rules
- Lockup: glowing chroma dot + “azaria” (weight 700) + “digital” (weight 400, dimmed). Never separate the dot from the wordmark.
- Case: always lowercase. “Azaria” (capitalised) is reserved for formal documents and legal copy.
- Clear space: keep at least the height of the dot on all sides.
- Grounds: designed for dark grounds. On light backgrounds, swap ink to #17130a and keep the gold mark unchanged.
- Don’t: don’t recolor the dot, add gradients, rotate, or set the lockup in all-caps.
Color
A near-black canvas, warm ink, and one precious gold. The palette is deliberately quiet so the work can be loud.
| Gold ratio | The chroma spectrum (cyan → violet → pink) appears in no more than ~5% of any surface. It marks the interactive and the important — never decorates. |
|---|---|
| Lines | 1px borders at rgba(255,255,255,0.08) structure sections; they never form boxes around content. |
| Darkness | All grounds are cool-tinted blacks, never pure #000, to keep the palette feeling like material, not a void. |
Type
Two families, four voices. Space Grotesk carries the display and Outfit the body — size and weight do the editorial work.
rare by nature
Display is set in Space Grotesk 700 at large sizes with tight leading and negative tracking — it should feel calm and oversized, never shouty. Secondary lines drop to a wider letterspacing and the chroma spectrum to create the “thin” counterpoint.
ART · MUSIC · VISION — KICKERS AND LABELS USE 0.4EM SPACING, UPPERCASE, CYAN.
| Display | Space Grotesk 700 · clamp(3.8rem, 11vw, 9.5rem) · line-height 0.95 · tracking -0.03em |
|---|---|
| Section title | Space Grotesk 700 · clamp(2.2rem, 4.8vw, 3.8rem) · line-height 1.1 |
| Body | Outfit 300 · 16px · line-height 1.6 · color #9aa1b8 for long copy |
| Kicker / label | Space Grotesk 700 · 13–14px · uppercase · tracking 0.2–0.35em · cyan |
| Scale rule | Fluid sizing via clamp() everywhere; the site has no fixed-pixel headline sizes. |
Voice & tone
The brand writes like a senior creative talking to a peer — precise, warm, a little poetic, never corporate.
How we sound
Short sentences. Concrete nouns. One idea per line. We are confident without being loud, and we would rather show the work than describe it.
What we avoid
No corporate filler (“solutions,” “synergy,” “unlock your potential”), no exclamation points in headings, and no hype about AI — we describe what the tools do, not what they “revolutionize.”
- Say “we make,” not “we deliver solutions.”
- Say “2–6 weeks,” not “agile timelines.”
- Name the craft: frame, mix, render, master.
Image & motion language
Photography and animation follow the same rules as color: dark, warm, restrained, and always in service of a subject.
| Photography | Low-key, warm-toned, shallow depth of field. Desaturated 85–90% by default; full color returns on hover. Faces and hands preferred over empty rooms. |
|---|---|
| Graphics | Generative and 3D work in the palette’s golds and warm blacks. No neon, no rainbow gradients, no stock “team high-fiving.” |
| Surfaces | Radius 14–18px on cards, 999px (pill) on controls. One 1px border per surface — never stacked borders or heavy shadows. |
| Motion | Easing: cubic-bezier(0.22, 1, 0.36, 1). Reveals rise 28px and fade over 0.9s. Nothing bounces; motion is a slow exhale. Honors prefers-reduced-motion. |
| Layout | 1200px measure, generous 130px section padding, numbered sections (01–09) as a quiet editorial spine. |
Keep it rare.
If a design decision feels like too much, it is. Cut until the gold is the only thing that shines.
Work with us