CURATED · OPEN · FREE

Le Labo

A premium fragrance brand presenting a raw, editorial aesthetic through moody photography and stark typography.

beautyfragrance

↓ Download design system (15 MB)Open in OpenDesign

Visit: https://www.lelabofragrances.com

📦 Browse pack contents →

Identity DNA

artisanalrawapothecaryluxuryfragrance

A refined, dark apothecary laboratory where raw materials meet modern minimalism.

Color

#FFFFFFInk

#333333Ink soft

#000000BG

#595959Muted

rgba(51, 51, 51, 1.0)Line

High-contrast monochrome palette relying on white text over dark, textured photography.

Typography

grotesque-sans

display30px · 900
heading18px · 700
body14px · 400

Heavy use of uppercase for headings and labels. · Wide letter-spacing applied to smaller uppercase text.

Spacing

4px

8px

16px

24px

32px

48px

64px

96px

Moderate rhythm with generous padding in primary containers.

Surfaces

sm · 0px

md · 0px

lg · 0px

pill · 999px

1px solid rgba(51, 51, 51, 1.0)

0 2px 4px rgba(0,0,0,0.1)

Layout

1200container

12columns

24pxgutter

768 / 1024breakpoints

Centered column layout with heavy use of full-width background imagery.

Motion & Interaction

100msmicro

300mssmall

0msmedium

cubic-bezier(0.25, 0.1, 0.25, 1.0)easing

Fast opacity transitions on hover. · No complex entry animations observed.

Opacity change on interactive elements. · Immediate state change with no complex feedback.

Components

button Full-width, dark rectangular block with white uppercase text.
card Image-based cards with minimal borders, relying on photography.
chip None observed in this view.
input White background dropdown with black text and subtle border.
hero Full-screen, moody photographic background with centered overlay text.

Voice & Don'ts

Tone Direct, authoritative, and understated.
Headlines Short, punchy uppercase statements.
CTAs All-caps, high-contrast buttons that command attention.

Don't use vibrant accent colors — screenshot shows a strictly monochrome palette.
Don't use rounded corners on primary buttons — screenshot shows sharp, rectangular edges.
Don't use serif fonts for primary headings — screenshot shows a bold, geometric grotesque-sans.
Don't clutter the interface with many small icons — screenshot shows a minimalist approach.
Don't use light, airy backgrounds — screenshot features dark, moody, and textured photography.
Don't use lowercase for primary call-to-action buttons — screenshot shows all-caps text.
Avoid: Playful language
Avoid: Bright colors
Avoid: Decorative elements

Inside the pack — real screenshots

Le Labo — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Captured from the live site · real computed styles

System prompt

This is a premium fragrance brand site with a dark, editorial aesthetic. It uses a high-contrast monochrome palette (Black #000000, White #FFFFFF, Muted #333333) over full-bleed, moody photography. Typography is exclusively bold, uppercase grotesque-sans (like the declared Bell Gothic Std). Key hex colors are #000, #FFF, and #333. Critical donts: Do not use vibrant accents, do not use rounded corners on buttons, and do not use lowercase for CTAs. The design is minimalist, focusing on the texture of the imagery and the starkness of the typography to convey artisanal luxury.

Bring this taste to your agent

Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.

OpenDesign skill ↗ · This pack for agents ↗

en · zh-CN · zh-TW · ja · ko