---
name: Le Labo
description: "This site is a masterclass in using photography and typography to establish a premium, artisanal brand identity without relying on a wide color palette."
version: alpha

colors:
  background: "#000000"
  primary: "#FFFFFF"
  secondary: "#333333"
  neutral: "#595959"
  muted-soft: "#424242"
  line: "rgba(51, 51, 51, 1.0)"

typography:
  display:
    fontFamily: grotesque-sans
    fontSize: 30px
    lineHeight: 1.0
    fontWeight: 900
    letterSpacing: "0px"
  heading:
    fontFamily: grotesque-sans
    fontSize: 18px
    lineHeight: 1.1
    fontWeight: 700
    letterSpacing: "0.5px"
  body:
    fontFamily: grotesque-sans
    fontSize: 14px
    lineHeight: 1.3
    fontWeight: 400
    letterSpacing: "0px"

rounded:
  sm: 0px
  md: 0px
  lg: 0px
  pill: 999px

spacing:
  xs: 4px
  sm: 8px
  md: 16px
  lg: 24px
  xl: 32px
  2xl: 48px
  3xl: 64px

---

## Overview

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

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

## Colors

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

- **Background (`#000000`)** — uses `bg` token
- **Primary text (`#FFFFFF`)** — uses `ink` token
- **Secondary text (`#333333`)** — uses `ink-soft` token
- **Muted (`#595959`)** — uses `muted` token
- **Borders (`rgba(51, 51, 51, 1.0)`)** — uses `line` token

## Typography

- **Display:** grotesque-sans
- **Body:** grotesque-sans

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

## Layout

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

*Rhythm:* Moderate rhythm with generous padding in primary containers.

## Elevation & Depth

- 0 2px 4px rgba(0,0,0,0.1)
- Borders: 1px solid rgba(51, 51, 51, 1.0)

## Shapes

- `sm`: 0px
- `md`: 0px
- `lg`: 0px
- `pill`: 999px

## 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.

## Do's and Don'ts

**Don't:**
- 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.

---

## System Prompt (paste into AI agent)

```
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.
```