---
name: Norse Projects
description: "This site is a masterclass in premium, minimalist e-commerce design, demonstrating how restraint and typography can create a sophisticated brand identity."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#58595B"
  secondary: "rgba(88,89,91,0.6)"
  neutral: "#808080"
  line: "rgb(238, 238, 239)"

typography:
  display:
    fontFamily: grotesque-sans
    fontSize: 26px
    lineHeight: 1.6
    fontWeight: 400
    letterSpacing: "0.7px"
  body:
    fontFamily: grotesque-sans
    fontSize: 13px
    lineHeight: 1.6
    fontWeight: 400
    letterSpacing: "0.7px"

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 minimalist fashion e-commerce site focusing on refined photography and clean typography.

*A premium Scandinavian fashion brand that feels like a curated gallery.*

## Colors

Extremely muted and monochromatic, relying almost entirely on photography for color.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#58595B`)** — uses `ink` token
- **Secondary text (`rgba(88,89,91,0.6)`)** — uses `ink-soft` token
- **Muted (`#808080`)** — uses `muted` token
- **Borders (`rgb(238, 238, 239)`)** — uses `line` token

## Typography

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

- Use Helvetica Neue LT Std or Arial as the primary sans-serif.
- Keep all body text in uppercase with wide letter-spacing.
- Maintain a consistent light weight of 400 across most UI elements.

## Layout

A tight 12-column grid with full-bleed hero sections and multi-column product grids.

*Rhythm:* A 4px base grid that supports generous padding within components and whitespace between grid items.

## Elevation & Depth

- Borders: 1px solid rgb(238, 238, 239)

## Shapes

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

## Components

- **button:** Minimal, text-based with uppercase letter-spacing, lacking visible borders or backgrounds.
- **card:** Borderless, focusing on large product photography with clean, uppercase typography below.
- **chip:** Small, uppercase text selectors for sizes, often accompanied by minimal color swatches.
- **input:** Sleek and minimalist, likely defined by a simple bottom border on a transparent background.
- **hero:** Full-bleed split-screen or full-width photography with uppercase titles and underlined links.

## Do's and Don'ts

**Don't:**
- Don't use drop shadows — screenshot shows completely flat, photography-driven surfaces.
- Don't use decorative border-radius on cards — screenshot shows sharp, rectangular product images.
- Don't use bold font weights for product names — screenshot shows a consistent weight of 400.
- Don't use underlined links in the main navigation — screenshot shows clean, plain text.
- Don't use bright, saturated accent colors — screenshot shows a monochromatic palette of grays.
- Don't use heavy background colors for buttons — screenshot shows text-only CTAs with underlines.

---

## System Prompt (paste into AI agent)

```
Norse Projects is a premium Scandinavian fashion e-commerce site defined by extreme minimalism and editorial photography. The palette is highly restrained, using #FFFFFF for backgrounds, #58595B for ink, and rgba(88,89,91,0.6) for soft ink, with #ECEEEF for subtle grid lines. Typography relies on a grotesque-sans (Helvetica Neue LT Std) used almost exclusively in uppercase with wide letter-spacing (0.7px) and a regular weight of 400. Key interactions involve subtle 0.2s transitions for background-size and top shifts. Critically, avoid using drop shadows or border-radius on cards, avoid bold font weights for product details, and avoid using bright accent colors or decorative button shapes.
```