---
name: Liquid Death
description: "This site is an excellent example of building a strong, irreverent brand identity through consistent use of bold typography and a restricted, high-impact color palette."
version: alpha

colors:
  background: "#E6E6E6"
  primary: "#000000"
  secondary: "#151515"
  tertiary: "#8A6D35"
  neutral: "#737373"
  bg-soft: "#F5F5F5"
  bg-quiet: "#040404"
  line: "rgba(227, 227, 227, 1.0)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 40px
    lineHeight: 1.0
    fontWeight: 700
    letterSpacing: "-0.5px"
  heading:
    fontFamily: humanist-sans
    fontSize: 32px
    lineHeight: 1.2
    fontWeight: 700
    letterSpacing: "0px"
  subheading:
    fontFamily: humanist-sans
    fontSize: 24px
    lineHeight: 1.3
    fontWeight: 700
    letterSpacing: "0px"
  body:
    fontFamily: humanist-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "0px"
  caption:
    fontFamily: humanist-sans
    fontSize: 14px
    lineHeight: 1.1
    fontWeight: 400
    letterSpacing: "0.4px"

rounded:
  sm: 2px
  md: 5px
  lg: 10px
  pill: 999px

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

---

## Overview

Rebellious, irreverent beverage brand using gothic punk aesthetics to sell healthy hydration.

*A punk rock energy drink brand selling water*

## Colors

High-contrast palette alternating between light grays, deep blacks, and a distinctive metallic gold accent for brand mark.

- **Background (`#E6E6E6`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`#151515`)** — uses `ink-soft` token
- **Accent (`#8A6D35`)** — uses `accent` token
- **Muted (`#737373`)** — uses `muted` token
- **Borders (`rgba(227, 227, 227, 1.0)`)** — uses `line` token

## Typography

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

- Use uppercase for all navigation links
- Use tight letter spacing for large display headlines
- Maintain bold weight (700) for all primary headings

## Layout

Centered content with large, full-width hero banners and prominent overlay modals.

*Rhythm:* 8px base grid with generous vertical padding (150px top / 56px bottom) for hero sections.

## Elevation & Depth

- 0px 4px 12px 0px rgba(0, 0, 0, 0.15)
- 0px 0px 18px 0px rgba(0, 0, 0, 0.2)
- Borders: 1px solid rgba(0, 0, 0, 0.15) for inputs; 1px solid rgb(0, 0, 0) for buttons

## Shapes

- `sm`: 2px
- `md`: 5px
- `lg`: 10px
- `pill`: 999px

## Components

- **button:** Transparent background with thick black border and uppercase text; no border-radius.
- **card:** Product imagery without visible container borders.
- **input:** White background with thin black border and placeholder text.
- **hero:** Full-width background imagery with large, bold typography and a clear call-to-action button.

## Do's and Don'ts

**Don't:**
- Don't use rounded corners on primary buttons — screenshot shows square/rectangular shapes instead
- Don't use a subtle or muted typography — screenshot shows bold, high-contrast headlines instead
- Don't use a colorful, playful palette — screenshot shows a strictly monochromatic base with a single gold accent instead
- Don't use small, delicate UI elements — screenshot shows large, chunky inputs and buttons instead
- Don't use a clean, empty aesthetic — screenshot shows dense, photorealistic backgrounds and busy imagery instead
- Don't use friendly, lowercase headlines — screenshot shows aggressive, uppercase text instead

---

## System Prompt (paste into AI agent)

```
Liquid Death uses a rebellious, punk-inspired aesthetic characterized by high-contrast black and white imagery, bold uppercase typography, and a distinctive gold metallic accent. The layout centers on immersive, full-width product photography and aggressive messaging. Key colors include a light gray background (#E6E6E6), deep blacks (#000000), and a metallic gold (#8A6D35) for brand elements. Typography relies heavily on geometric sans-serif fonts in bold weights with uppercase transforms. Critical design rules: avoid rounded corners on interactive elements, maintain aggressive and humorous copy, and utilize large, punchy headlines over subtle or delicate text.
```
