---
name: Polestar
description: "An exceptional example of Scandinavian minimalism where typography and photography do all the heavy lifting, making it a perfect reference for premium, restraint-focused design."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#000000"
  secondary: "rgba(0,0,0,0.6)"
  neutral: "rgba(0,0,0,0.6)"
  bg-quiet: "#F0F0F0"
  line: "rgba(0,0,0,0.1)"

typography:
  display:
    fontFamily: grotesque-sans
    fontSize: 48px
    lineHeight: 1.09
    fontWeight: 400
    letterSpacing: "-1.2px"
  headline:
    fontFamily: grotesque-sans
    fontSize: 30px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "-0.3px"
  body:
    fontFamily: grotesque-sans
    fontSize: 16px
    lineHeight: 1.125
    fontWeight: 400
    letterSpacing: "-0.3px"

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 clean, photo-forward premium EV brand balancing luxury with transparency.

*A minimalist art gallery where each electric vehicle is the sole exhibit.*

## Colors

Monochromatic palette relying on photography for visual interest.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`rgba(0,0,0,0.6)`)** — uses `ink-soft` token
- **Muted (`rgba(0,0,0,0.6)`)** — uses `muted` token
- **Borders (`rgba(0,0,0,0.1)`)** — uses `line` token

## Typography

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

- Extremely tight tracking on all text
- Uniform font weight of 400 used across all text elements
- Line heights kept compact to create a dense, structured feel

## Layout

Full-bleed hero images with left-aligned text overlays.

*Rhythm:* Based on a 4px grid with generous whitespace between major sections.

## Elevation & Depth

- Borders: Minimal borders; buttons use thin 1px solid outlines.

## Shapes

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

## Components

- **button:** Ghost buttons with white text, 1px solid white border, and a trailing arrow icon.
- **card:** Image-led cards with minimal UI, focusing purely on the product photography.
- **hero:** Full-screen photographic background with a semi-transparent dark overlay for text legibility.

## Do's and Don'ts

**Don't:**
- don't use drop shadows — screenshot shows flat, border-based buttons instead
- don't use heavy font weights — screenshot shows a uniform 400 weight throughout
- don't use rounded corners on cards — screenshot shows sharp, square edges
- don't use bright accent colors — screenshot relies purely on black, white, and photography
- don't use wide letter-spacing — screenshot shows negative tracking (-0.3px to -1.2px)
- don't use solid filled buttons — screenshot uses transparent ghost buttons with outlines

---

## System Prompt (paste into AI agent)

```
A minimalist, premium EV brand website characterized by a monochromatic palette (#000, #FFF, #F0F0F0) and a clean, photo-forward editorial layout. Typography utilizes a grotesque-sans font (Polestar Unica) with a uniform 400 weight and extremely tight letter-spacing (-0.3px to -1.2px) across 48px display and 16px body sizes. The layout features full-bleed hero sections with dark overlays and ghost buttons. Critical donts: avoid using drop shadows, heavy font weights, bright accent colors, wide letter-spacing, or solid filled buttons. The design relies entirely on high-quality photography and negative space to create a sense of luxury and clarity.
```
