---
name: Leifproducts
description: "This site is worth including as a perfect example of using restrained typography and a strictly neutral palette to elevate rich, atmospheric photography."
version: alpha

colors:
  background: "#FAFAF9"
  primary: "#000000"
  secondary: "#262525"
  neutral: "#B2B2B2"
  muted-soft: "#EDEDE7"
  line: "rgb(214, 209, 199)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 52px
    lineHeight: 1.0
    fontWeight: 500
    letterSpacing: "-0.52px"
  body:
    fontFamily: grotesque-sans
    fontSize: 16px
    lineHeight: 1.15
    fontWeight: 500
    letterSpacing: "normal"
  caption:
    fontFamily: grotesque-sans
    fontSize: 12px
    lineHeight: 1.3
    fontWeight: 500
    letterSpacing: "0.65px"

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

spacing:
  xs: 4px
  sm: 8px
  md: 12px
  lg: 16px
  xl: 20px
  2xl: 24px
  3xl: 32px

---

## Overview

A refined Australian botanical brand using expansive photography and restrained typography to evoke a calm, natural luxury.

*A curated botanical journal meets a coastal luxury retreat.*

## Colors

High-contrast neutrals (black, off-white, muted grays) serve as a clean canvas to let the earthy, natural photography take center stage.

- **Background (`#FAFAF9`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`#262525`)** — uses `ink-soft` token
- **Muted (`#B2B2B2`)** — uses `muted` token
- **Borders (`rgb(214, 209, 199)`)** — uses `line` token

## Typography

- **Display:** geometric-sans
- **Body:** grotesque-sans
- **Mono:** monospaced

- Use uppercase with wide tracking for navigation and category labels.
- Maintain tight negative tracking on large display headings.
- Use monospaced typography for descriptive scent notes and categorizations.

## Layout

A clean, multi-column asymmetric grid that favors large photographic blocks paired with generous whitespace and tight text blocks.

*Rhythm:* A combination of 4px base increments and generous 113px vertical padding creates a distinct, airy rhythm.

## Elevation & Depth

- rgba(0, 0, 0, 0.1) 0px 2px 20px 0px
- Borders: 1px solid rgb(214, 209, 199) or rgb(38, 37, 37)

## Shapes

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

## Components

- **button:** Solid black rectangular buttons with uppercase white text.
- **card:** Image-centric cards with minimal text overlays and subtle borders.
- **chip:** Radio-style circular selectors with uppercase text labels.
- **input:** Minimal inputs with subtle bottom borders and monospaced text.
- **hero:** Split-screen layout with a dominant full-height image and a dedicated text column.

## Do's and Don'ts

**Don't:**
- Don't use bright or saturated accent colors — screenshot shows a strictly neutral, monochromatic palette.
- Don't use decorative or highly stylized fonts — screenshot shows clean geometric and grotesque sans-serifs.
- Don't overcrowd the layout — screenshot shows generous whitespace and large breathing room between elements.
- Don't use heavily rounded corners everywhere — screenshot shows sharp edges or very subtle 6-8px border radii.
- Don't use complex, multi-color gradients — screenshot shows flat solid backgrounds.
- Don't rely on heavy drop shadows for depth — screenshot uses mostly flat design with minimal, subtle shadows.

---

## System Prompt (paste into AI agent)

```
Leif Products is a refined Australian botanical brand utilizing an editorial, photography-driven design to convey calm and natural luxury. The palette relies on high-contrast neutrals, featuring an off-white background (#FAFAF9), pure black text (#000000), and subtle warm grays (#EDEDE7). Typography alternates between a geometric sans for display, a grotesque sans for body text, and a monospaced font for descriptive details, maintaining a clean and structured hierarchy. Critically, avoid using vibrant accent colors, overuse of rounded corners, or cluttered layouts; instead, prioritize generous whitespace, large photographic focal points, and sharp, minimalist UI components with subtle 0.3s transitions.
```
