---
name: Elevenlabs
description: "Worth including as a prime example of a modern, premium SaaS aesthetic that balances professionalism with a warm, slightly playful feel through its use of soft gradients and rounded shapes."
version: alpha

colors:
  background: "#FDFCFC"
  primary: "#000000"
  secondary: "#777169"
  neutral: "#E5E5E5"
  bg-soft: "#F5F3F1"
  bg-quiet: "#EBE8E4"
  line: "rgba(0,0,0,0.05)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 56px
    lineHeight: 1.0
    fontWeight: 500
    letterSpacing: "-1px"
  heading:
    fontFamily: humanist-sans
    fontSize: 32px
    lineHeight: 1.2
    fontWeight: 500
    letterSpacing: "-0.5px"
  body:
    fontFamily: humanist-sans
    fontSize: 18px
    lineHeight: 1.6
    fontWeight: 400
    letterSpacing: "0px"
  small:
    fontFamily: humanist-sans
    fontSize: 14px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "0.14px"

rounded:
  sm: 4px
  md: 8px
  lg: 20px
  pill: 9999px

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

---

## Overview

Premium AI audio platform with a clean, warm, and slightly playful aesthetic.

*A high-end recording studio interface brought to a clean digital canvas*

## Colors

High-contrast ink on warm neutrals with soft, organic gradients for accents

- **Background (`#FDFCFC`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`#777169`)** — uses `ink-soft` token
- **Muted (`#E5E5E5`)** — uses `muted` token
- **Borders (`rgba(0,0,0,0.05)`)** — uses `line` token

## Typography

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

## Layout

Clean, single-column layout with generous whitespace and centered containers

*Rhythm:* Consistent use of 8px and 16px increments for padding and gaps

## Elevation & Depth

- 0 1px 2px 0 rgba(0,0,0,0.04)
- 0 2px 4px 0 rgba(0,0,0,0.04)
- 0 0 0 1px rgba(0,0,0,0.06)
- Borders: Very subtle 1px borders in rgba(0,0,0,0.05) or rgb(229,229,229)

## Shapes

- `sm`: 4px
- `md`: 8px
- `lg`: 20px
- `pill`: 9999px

## Components

- **button:** Pill-shaped (9999px radius) with solid black background for primary and white/outlined for secondary
- **card:** Light gray background with very subtle border-radius (20px) and soft shadows
- **chip:** Pill-shaped with 1px border and transparent background
- **input:** Clean with 1px subtle border and rounded corners
- **hero:** Large bold headline left-aligned with supporting text and pill buttons

## Do's and Don'ts

**Don't:**
- Don't use pure white backgrounds — screenshot shows a warm off-white (#FDFCFC) instead
- Don't use sharp corners — screenshot shows 20px radius on large cards and 9999px on buttons
- Don't use high-chroma accent colors — screenshot shows organic, soft gradients instead
- Don't use thin, light fonts for headlines — screenshot shows 500 weight for display text
- Don't use complex backgrounds — screenshot shows clean, mostly flat surfaces
- Don't use tight spacing — screenshot shows generous padding (160px top) and gaps (48px)

---

## System Prompt (paste into AI agent)

```
A premium AI audio platform (SaaS) for enterprises and creators. Key colors are warm off-white (#FDFCFC) for backgrounds, solid black (#000000) for ink, and soft muted tones (#777169, #EBE8E4). Typography combines geometric-sans for display with humanist-sans for body. Critical don'ts: avoid pure white backgrounds, use 9999px pill radius for buttons, never use high-chroma accent colors, use generous whitespace, use 500 font-weight for display text, avoid complex background patterns.
```