---
name: Audo Copenhagen
description: "Worth including as a prime example of restrained, premium e-commerce design where atmosphere and editorial photography take precedence over dense information display."
version: alpha

colors:
  background: "#F5F3EB"
  primary: "#2F2B23"
  secondary: "#141414"
  tertiary: "#929172"
  neutral: "#817E74"
  bg-soft: "#FFFFFF"
  muted-soft: "#929172"
  line: "rgba(47,43,35,0.3)"

typography:
  display:
    fontFamily: transitional-serif
    fontSize: 48px
    lineHeight: 1.1
    fontWeight: 400
    letterSpacing: "0px"
  heading:
    fontFamily: geometric-sans
    fontSize: 28px
    lineHeight: 1.3
    fontWeight: 400
    letterSpacing: "0px"
  body:
    fontFamily: geometric-sans
    fontSize: 14px
    lineHeight: 1.48
    fontWeight: 400
    letterSpacing: "0.2px"
  small:
    fontFamily: geometric-sans
    fontSize: 12px
    lineHeight: 1.08
    fontWeight: 400
    letterSpacing: "0.1px"

rounded:
  sm: 2.5px
  md: 4px
  lg: 10px
  pill: 9999px

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

---

## Overview

Warm, premium Scandinavian furniture e-commerce with a restrained, editorial aesthetic

*A curated gallery for high-end Scandinavian home goods*

## Colors

Warm neutrals with earthy, low-chroma accents create a calm, premium atmosphere

- **Background (`#F5F3EB`)** — uses `bg` token
- **Primary text (`#2F2B23`)** — uses `ink` token
- **Secondary text (`#141414`)** — uses `ink-soft` token
- **Accent (`#929172`)** — uses `accent` token
- **Muted (`#817E74`)** — uses `muted` token
- **Borders (`rgba(47,43,35,0.3)`)** — uses `line` token

## Typography

- **Display:** transitional-serif
- **Body:** geometric-sans

- Uppercase small text for navigation and category labels
- Light weight (400) used across most text elements
- Serif fonts used for branding and display to convey elegance

## Layout

Full-width photographic hero sections with centered content

*Rhythm:* Consistent vertical rhythm with generous padding for an airy feel

## Elevation & Depth

- 0px 4px 5px 0px rgba(47,43,35,0)
- 0px 32px 68px 0px rgba(0,0,0,0.3)
- Borders: Subtle 1px borders in muted earthy tones, often only on specific sides

## Shapes

- `sm`: 2.5px
- `md`: 4px
- `lg`: 10px
- `pill`: 9999px

## Components

- **button:** Outline style with thin borders, filled style using the muted accent color, uppercase small text
- **card:** Minimal styling, relying on large photography and generous whitespace
- **chip:** Simple toggle switches with rounded pill shapes and earthy fill colors
- **input:** Simple underline or minimal border inputs, not prominently featured
- **hero:** Full-viewport cinematic product photography with centered serif typography

## Do's and Don'ts

**Don't:**
- Don't use bright, saturated primary colors — screenshot shows a restrained palette of warm neutrals (#F5F3EB, #2F2B23) and earthy accents (#929172)
- Don't use heavy, bold typography — screenshot shows font weights predominantly at 400 (regular)
- Don't clutter the layout with multiple competing elements — screenshot shows a clean, spacious layout focused on large imagery
- Don't use sharp, 0px border-radii — screenshot shows subtle rounding (2.5px to 10px) even on minimal elements
- Don't use standard blue link colors or red CTAs — screenshot shows actions in muted earthy tones or simple black text
- Don't create dense navigation menus — screenshot shows wide spacing between uppercase navigation items

---

## System Prompt (paste into AI agent)

```
Design a premium Scandinavian furniture e-commerce site. Position it as a curated, editorial gallery rather than a typical retail shop. Use a warm, restrained palette: cream background (#F5F3EB), dark earthy ink (#2F2B23), and a muted olive accent (#929172). Typography should pair a transitional serif for elegant headlines with a clean geometric sans-serif for body text, keeping font weights light (400). Critical donts: Do not use bright, saturated colors or high-contrast accents. Do not use heavy, bold typography. Do not clutter the interface; prioritize generous whitespace and large, cinematic product photography. Do not use harsh, sharp corners everywhere. Do not use standard web blue or red for interactive elements. Do not create dense, crowded layouts.
```
