---
name: Ferrari
description: "A masterclass in using photography as the primary design element with extreme typographic restraint."
version: alpha

colors:
  background: "#181818"
  primary: "#ffffff"
  neutral: "#8f8f8f"
  line: "rgba(255, 255, 255, 1)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 64px
    lineHeight: 1.0
    fontWeight: 500
    letterSpacing: "-1px"

rounded:
  sm: 4px
  md: 8px
  lg: 12px
  pill: 999px

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

---

## Overview

A high-contrast, image-first luxury automotive experience with restrained typography.

*A private member's club for automotive excellence*

## Colors

High-contrast monochrome that defers to photography.

- **Background (`#181818`)** — uses `bg` token
- **Primary text (`#ffffff`)** — uses `ink` token
- **Muted (`#8f8f8f`)** — uses `muted` token
- **Borders (`rgba(255, 255, 255, 1)`)** — uses `line` token

## Typography

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

- All caps for primary navigation and section headers
- Tight letter-spacing on display text
- Generous tracking on navigation items

## Layout

Full-bleed photographic hero with centered overlay text.

*Rhythm:* 8px base rhythm for UI elements

## Elevation & Depth

- 0 4px 12px rgba(0, 0, 0, 0.3)
- Borders: 1px solid white for interactive elements

## Shapes

- `sm`: 4px
- `md`: 8px
- `lg`: 12px
- `pill`: 999px

## Components

- **button:** Outline circle with arrow icon for discovery actions
- **card:** Full-bleed photographic tile with centered text overlay
- **hero:** Edge-to-edge high-resolution photography with minimal text overlay

## Do's and Don'ts

**Don't:**
- Don't use multiple background colors — screenshot shows a single dark (#181818) or black background.
- Don't use decorative fonts — screenshot shows clean, geometric sans-serif typography.
- Don't add heavy drop shadows to text — screenshot shows text directly over images without heavy shadows.
- Don't use colorful accent buttons — screenshot shows minimalist white outline buttons.
- Don't use complex grid patterns — screenshot shows full-bleed, edge-to-edge photographic layouts.
- Don't use small, cramped text — screenshot shows generous letter-spacing and clear hierarchy.

---

## System Prompt (paste into AI agent)

```
This is a premium luxury automotive website defined by large-scale photography and minimalist, high-contrast typography. The primary color palette is dark (#181818) with white (#ffffff) text, using a geometric sans-serif for headlines and a standard sans-serif for body text. Navigation and headers are typically uppercase with generous tracking. Key interaction patterns include circular outline 'discover' buttons and full-bleed photographic tiles. Critically, do not use multiple background colors, avoid decorative or script fonts, and never clutter the photographic hero sections with heavy text overlays or colorful accents. The experience should feel exclusive, restrained, and performance-oriented.
```