---
name: Loewe
description: "This site is a masterclass in luxury e-commerce design, demonstrating how powerful, high-quality imagery and extreme restraint in UI can create a premium brand experience."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#000000"
  tertiary: "#00AEEF"
  line: "rgba(0,0,0,1)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 120px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "0"
  heading:
    fontFamily: geometric-sans
    fontSize: 22px
    lineHeight: 1.15
    fontWeight: 400
    letterSpacing: "0"
  body:
    fontFamily: geometric-sans
    fontSize: 14px
    lineHeight: 1.4
    fontWeight: 400
    letterSpacing: "0"
  caption:
    fontFamily: geometric-sans
    fontSize: 13px
    lineHeight: 1.3
    fontWeight: 400
    letterSpacing: "0"

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

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

---

## Overview

A premium fashion house site that pairs large-scale photography with minimalist chrome to elevate product storytelling.

*A high-fashion magazine spread brought to life.*

## Colors

Stark black and white base that lets rich photographic imagery dominate, punctuated by a singular, bold cyan accent.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Accent (`#00AEEF`)** — uses `accent` token
- **Borders (`rgba(0,0,0,1)`)** — uses `line` token

## Typography

- **Display:** geometric-sans
- **Body:** geometric-sans

- Use Avus for all primary headings and UI elements.
- Maintain a strict typographic hierarchy with generous spacing between levels.
- Keep font weights regular or medium; avoid bold weights in standard text.

## Layout

A full-bleed, magazine-style layout dominated by large imagery, with generous whitespace and a fixed top navigation bar.

*Rhythm:* A consistent 4px base grid with generous padding, often 24px horizontally, to create breathing room around content blocks.

## Elevation & Depth

- Borders: Minimal, using 1px solid black lines for subtle division where necessary.

## Shapes

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

## Components

- **button:** Minimal, often just text with a triangle icon (▸), relying on typography and whitespace rather than containers.
- **card:** Content is presented through large, full-width images paired with clean typography below, acting as expansive cards.
- **input:** A simple text field with a single bottom border, no background or visible container.
- **hero:** A massive, full-viewport photographic hero with oversized, bold typography overlaid directly on the image.

## Do's and Don'ts

**Don't:**
- Don't use drop shadows — screenshot shows flat, clean layouts.
- Don't use rounded corners on containers — screenshot shows sharp, zero-radius edges.
- Don't use bold font weights for body text — screenshot shows regular weight text.
- Don't use complex gradients — screenshot shows solid colors and clean photography.
- Don't use a wide, filled button style for primary actions — screenshot shows minimalist text links.
- Don't overcrowd the layout with multiple columns of text — screenshot shows generous whitespace.

---

## System Prompt (paste into AI agent)

```
You are designing a premium fashion house website. The aesthetic is editorial and photographic, dominated by large imagery and minimalist UI. Key colors are a clean white (#FFFFFF) background, black (#000000) text, and a singular, bold cyan (#00AEEF) accent for the brand name. Typography uses a geometric sans-serif (Avus) across all scales, from massive display titles to small navigation text. Critical don'ts: Never use drop shadows on elements. Never apply rounded corners to containers. Never use bold font weights for standard body copy. The layout is magazine-style with generous whitespace and full-bleed imagery. Interactions should be smooth and subtle, using cubic-bezier easing.
```