VAEV · Hub
HubBrand guidelines
VAEVBrand Guidelines · v1.0
The Book

Guidelines for a quiet brand.

VAEV is a system of restraint. Every mark, letter, and margin exists to protect one feeling: composure. These pages define how the brand is drawn, spoken, and spaced.

01

Logo

02

Typography

03

Tone

04

Colour

05

Spacing

06

Icons

02Typography

One family, held at Light. Weight is expressed through space, not stroke.

Primary typeface

Inter

Sans-serif geometric-humanist family. Used for every heading, body line, and label.

Allowed weights

Light 300 · Regular 400

Render settings

Anti-aliased · -webkit-font-smoothing: antialiased

Micro-label

Founding 500 · MMXXVI

10px / 400 / uppercase / 0.22em tracking

Used for stage markers, kickers, section numbers, and meta.

Hierarchy
H1 / Display
48–72px / 300 / 1.05 / -0.01em
A daily scent, worn as ritual
H2 / Headline
28–36px / 300 / 1.1 / -0.005em
Rebuilt from the molecule up
H3 / Subhead
22–24px / 300 / 1.2 / 0
The first drop, numbered
Body
15–16px / 300 / 1.7 / 0
Five hundred numbered units. Held on your name.
Caption
12–13px / 400 / 1.5 / 0.01em
Limited edition · 500 units
Micro
10px / 400 / 1.4 / 0.22em
FOUNDING 500 · MMXXVI
Heading example

A daily scent, worn as ritual.

H1 / Display: 48–72px, Light 300, leading 1.05, tracking -0.01em.

Body example

Five hundred numbered units. Held on your name. No restocks, no shortcuts. This is how VAEV introduces itself: quietly, completely, once.

Body: 15–16px, Light 300, leading 1.7.

03Tone of Voice

Speak plainly. The product is the persuasion.

Restraint

One sentence that lands is better than five that explain. Cut adjectives. Let the fact of 500 numbered units carry the weight.

Specificity

Say 'matte black basalt disc' instead of 'luxury object'. Say 'aluminium-free base' instead of 'clean formula'. Precision builds trust.

Action

Write as if the reader is already wearing it. 'Hold the first drop on your name.' Not 'Unlock exclusive access.'

Brand words

Reach for these when describing the product, the experience, or the promise.

RitualDropComposureRestraintNumberedHeldQuietMoleculeWearSkinScentUnitEditionReserveFormulaBaseDaily
Words to avoid

These words inflate, generalise, or sound like every other brand. Let them go.

LuxuryPremiumExclusiveGame-changerRevolutionaryBestUltimateUnlockHustleTransformAmazingBespokeCuratedElevateArtisanalDisruptIconicStorytelling
Before / after
Avoid

This premium fragrance is a game-changer for your daily routine.

Use

A daily scent, worn as ritual.

Avoid

Unlock exclusive access to our curated luxury drop.

Use

Hold the first drop on your name.

Avoid

Join our community of discerning fragrance lovers.

Use

Five hundred units. Held on your name.

03Palette

A palette of six. No accents, no gradients.

Ink

--foreground
#F2F2F2rgb(242, 242, 242)

Primary type, iconography, hairlines on light surfaces.

Paper

--background
#020202rgb(2, 2, 2)

Base canvas, reversed contexts, generous negative space.

Grey 1

--vaev-grey-1
#0D0D0Drgb(13, 13, 13)

Recessed surfaces, cards, subtle depth.

Grey 2

--vaev-grey-2
#2E2E2Ergb(46, 46, 46)

Dividers on dark, tertiary UI, disabled states.

Grey 3

--vaev-grey-3
#717171rgb(113, 113, 113)

Secondary copy, micro-labels, meta.

Hairline

--vaev-hairline
rgba(255, 255, 255, 0.08)rgba(255, 255, 255, 0.08)

1px dividers, section boundaries, form borders.

Background examples

Primary surface

Paper #020202

Default page and section canvas.

Recessed surface

Grey 1 #0D0D0D

Cards, panels, and call-out containers.

Tertiary surface

Grey 2 #2E2E2E

Disabled states, placeholder zones, and divider bands.

Reversed surface

Ink #F2F2F2

Light-mode reversal, high-contrast CTAs, and print canvas.

04Spacing

A four-based grid. Air is the loudest material.

Base unit

4px

All vertical rhythm scales in multiples of four. Sections breathe in increments of 8, 16, 24, 64, 96, 160, and 224.

4px
Icon-to-label, inline separators.
8px
Form field internals.
16px
Copy blocks, list gaps.
24px
Card interior padding.
64–96px
Section rhythm on desktop.
160–224px
Monumental spacing (py-40 / py-56) between chapters.
Grid

12-column base with 16–32px gutters. Editorial layouts favour asymmetric spans (5/7, 4/8).

05Photography

Photography carries the mood. Skin, stone, mist, glass.

Material

Frosted glass, brushed steel, weathered stone, raw linen. Objects at rest.

Light

North-facing, single-source, no fill. Shadows are welcome and long.

Human

Skin, hands, napes, wrists. Never eye-contact. The subject is unaware.

Composition

Rules of the frame

Every frame is built on the same quiet grid. Subject small, space large, horizon low.

Ratio
3:2 or 4:5. Never square unless cropped for social.
Subject
Occupies ≤ 40% of frame. Placed on lower or right third.
Negative space
≥ 50% of the frame is quiet — sky, wall, mist, floor.
Horizon
Lower third. Never centred. Never tilted.
Depth
One plane in focus. Foreground or background softly out.
Motion
Stillness first. If movement, only breath or fabric.
Colour treatment

Grade toward cool neutral.

Desaturate to roughly 60%. Lift shadows a hair, hold highlights. Skin stays warm; the room goes cool.

  • · Saturation −40%
  • · Temperature −300K (cool)
  • · Contrast −10, blacks +5
  • · Grain 8–12 (film emulation)
Raw
Graded
Final
Reference thumbnails
Stone
Mist
Glass
Skin
Linen
Steel
Mist II
Shadow
06Illustration

Line, not colour. Diagram, not decoration.

Line

0.5–1px hairlines in Paper on Ink. No brushwork, no texture, no shading.

Form

Geometric primitives — circle, line, arc. Molecular diagrams and cross-sections.

Voice

Technical, clinical, patient. Illustration explains; it never performs.

Example marks
Molecule
Grid
Bottle
Diffusion
08Iconography

Line, not glyph. One weight across the set.

Stroke

1px hairline on 24px canvas. All icons share the same stroke weight. No fills, no gradients, no shadows.

Grid

Draw on a 24×24 keyline with 2px padding. Optical correction is allowed; mathematically perfect centre is not.

Touch

Interactive icons sit inside a 44×44dp target. Decorative icons may be smaller, but never below 16px.

Base size

16px

Minimum inline icon. Meta rows, inline labels.

20px

Default UI icon. Buttons, inputs, navigation.

24px

Large icon. Toolbars, feature blocks, empty states.

Grid construction

24px canvas with 2px keyline padding. Icon body sits on the inner grid.

Menu
Cart
Arrow
External

Common UI marks. Every stroke is 1.5px, corners are rounded, and icons are optically balanced, not centred by math.

Do / don't

DoKeep line weight uniform across the set.

Don'tUse filled glyphs or solid shapes.

Don'tMix stroke weights within one icon.

Don'tCrowd the canvas with ornamental detail.