# Perplexity

> `perplexity@1.0.0`

Perplexity is an AI-native answer engine — a conversational search product that returns cited, sourced answers in place of the traditional ten-blue-links results page. The brand voice is authoritative and reference-grade: every claim is footnoted with primary sources, every answer cards a citation rail. Visually, Perplexity is dark-first and cool: a deep "Inky" near-black canvas with a warm "Paper" cream inverse, fronted by the signature Peacock teal — a cyan-green accent that marks every citation, action button, and Pro upgrade surface. Typography is the proprietary FK Grotesk Neue paired with Newsreader for serif passages and Berkeley Mono for code.


**Tags:** `perplexity`, `ai`, `search`, `answer-engine`, `brand`, `dark-first`, `teal`, `citation`

## Atoms

### Palette

**Perplexity** · `perplexity@1.0.0` · Proprietary — All Rights Reserved

> Perplexity's brand palette as captured from the live answer engine (perplexity.ai) and the docs surface (docs.perplexity.ai). The brand is dark-first by default: a deep "Inky" near-black canvas with a warm "Paper" cream inverse, fronted by Perplexity's signature "Peacock" teal accent — a calibrated cyan-green that appears as the action color across answer cards, citations, and Pro upgrade surfaces. A muted secondary palette of pale-yellow paper tones and OKLCH-pale-cyan neutrals carries the typography. Perplexity is dark-first; the light mode used by users who prefer it flips Inky to a warm Paper canvas with deep ink text. 

### Fonts

| Role | Font | License | Classification |
|------|------|---------|----------------|
| `heading` | **Space Grotesk** `(space-grotesk@1.0.0)` | OFL-1.1 | sans-serif |
| `body` | **Space Grotesk** `(space-grotesk@1.0.0)` | OFL-1.1 | sans-serif |
| `serif` | **PT Serif** `(pt-serif@1.0.0)` | OFL-1.1 | serif |
| `mono` | **Geist Mono** `(geist-mono@1.0.0)` | OFL-1.1 | monospace |

## Swatches

| ID | Name | Value |
|----|------|-------|
| `inky` | Inky | `#100E12` |
| `inky-deep` | Inky Deep | `#082125` |
| `inky-elevated` | Inky Elevated | `#1F2121` |
| `inky-quiet` | Inky Quiet | `#211B1A` |
| `paper` | Paper | `#FCFCF9` |
| `paper-elevated` | Paper Elevated | `#F5F5F5` |
| `paper-warm` | Paper Warm | `#F7F7F8` |
| `peacock` | Peacock | `#1FB8CD` |
| `peacock-bright` | Peacock Bright | `#32B8C6` |
| `peacock-deep` | Peacock Deep | `#139FB2` |
| `peacock-soft` | Peacock Soft | `#92DCE2` |
| `peacock-button` | Peacock Button | `#35BDC8` |
| `peacock-banner` | Peacock Banner | `#1A6872` |
| `peacock-pale` | Peacock Pale | `#27CAE0` |
| `marigold` | Marigold | `#F0B435` |
| `marigold-soft` | Marigold Soft | `#FFAB44` |
| `marigold-pale` | Marigold Pale | `#FEF08A` |
| `rust` | Rust | `#E68161` |
| `ember` | Ember | `#E10600` |
| `violet-soft` | Violet Soft | `#C48ED8` |
| `text-on-paper` | Text on Paper | `#121516` |
| `text-on-inky` | Text on Inky | `#E0E0E0` |
| `text-secondary` | Text Secondary | `#5D5F5F` |
| `border-quiet` | Border Quiet | `#84754E` |

## Mode role mappings

### Light mode

| Role | Swatch | Hex |
|------|--------|-----|
| `background` | `paper` | `#FCFCF9` |
| `surface` | `paper-elevated` | `#F5F5F5` |
| `surface-elevated` | `paper` | `#FCFCF9` |
| `text-primary` | `text-on-paper` | `#121516` |
| `text-secondary` | `text-secondary` | `#5D5F5F` |
| `text-tertiary` | `border-quiet` | `#84754E` |
| `primary` | `peacock-deep` | `#139FB2` |
| `primary-hover` | `peacock-banner` | `#1A6872` |
| `accent` | `peacock` | `#1FB8CD` |
| `accent-hover` | `peacock-deep` | `#139FB2` |
| `warning` | `marigold` | `#F0B435` |
| `warning-hover` | `marigold-soft` | `#FFAB44` |
| `error` | `ember` | `#E10600` |
| `success` | `peacock` | `#1FB8CD` |
| `border` | `paper-elevated` | `#F5F5F5` |

### Dark mode

| Role | Swatch | Hex |
|------|--------|-----|
| `background` | `inky` | `#100E12` |
| `surface` | `inky-elevated` | `#1F2121` |
| `surface-elevated` | `inky-quiet` | `#211B1A` |
| `text-primary` | `text-on-inky` | `#E0E0E0` |
| `text-secondary` | `paper-warm` | `#F7F7F8` |
| `text-tertiary` | `text-secondary` | `#5D5F5F` |
| `primary` | `peacock-bright` | `#32B8C6` |
| `primary-hover` | `peacock-soft` | `#92DCE2` |
| `accent` | `peacock` | `#1FB8CD` |
| `accent-hover` | `peacock-soft` | `#92DCE2` |
| `warning` | `marigold` | `#F0B435` |
| `warning-hover` | `marigold-soft` | `#FFAB44` |
| `error` | `ember` | `#E10600` |
| `success` | `peacock-pale` | `#27CAE0` |
| `border` | `inky-quiet` | `#211B1A` |

## Brand semantic roles

### Colors

| Role | Swatch | Hex |
|------|--------|-----|
| `identity` | `inky` | `#100E12` |
| `on-identity` | `text-on-inky` | `#E0E0E0` |
| `primary` | `peacock-bright` | `#32B8C6` |
| `primary-hover` | `peacock-soft` | `#92DCE2` |
| `accent` | `peacock` | `#1FB8CD` |
| `accent-hover` | `peacock-deep` | `#139FB2` |
| `mark` | `peacock` | `#1FB8CD` |
| `success` | `peacock-pale` | `#27CAE0` |
| `warning` | `marigold` | `#F0B435` |
| `error` | `ember` | `#E10600` |
| `text-primary-light` | `text-on-paper` | `#121516` |
| `text-primary-dark` | `text-on-inky` | `#E0E0E0` |
| `background-light` | `paper` | `#FCFCF9` |
| `background-dark` | `inky` | `#100E12` |
| `surface-light` | `paper-elevated` | `#F5F5F5` |
| `surface-dark` | `inky-elevated` | `#1F2121` |
| `text-secondary-light` | `text-secondary` | `#5D5F5F` |
| `text-tertiary-light` | `border-quiet` | `#84754E` |
| `border-light` | `paper-elevated` | `#F5F5F5` |
| `border-dark` | `inky-quiet` | `#211B1A` |

### Typography

| Role | Font role key |
|------|---------------|
| `display` | `heading` |
| `prose` | `body` |
| `serif` | `serif` |
| `code` | `mono` |

## Rules

### 🛑 error (4)

#### `contrastRatio` → `text-primary`

- **against:** `background`
- **minRatio:** `7`
- **standard:** `WCAG-AAA`

> Soft warm-white (#E0E0E0) on Inky (#100E12) gives roughly 15:1 — clears AAA decisively. Perplexity's reference-grade reading posture, with dense citation rails and long-form sourced answers, justifies an AAA target rather than the AA floor. 

#### `colorChoice` → `roles.colors.primary`

- **allowed:** peacock, peacock-bright, peacock-deep, peacock-button
- **forbidden:** marigold, ember, rust, violet-soft

> Peacock teal (#1FB8CD / #32B8C6 / #35BDC8) is Perplexity's signature accent and the action color on perplexity.ai and docs.perplexity.ai. Marigold is reserved for Pro / Max surface indicators, ember for destructive actions, rust and violet-soft for editorial illustration only — none of these substitute for the Peacock primary. 

#### `colorChoice` → `roles.colors.identity`

- **allowed:** inky, inky-deep
- **forbidden:** paper, peacock, peacock-bright, marigold

> Perplexity is dark-first by construction; the documented dark theme-color meta is #100E12. The identity surface is the Inky canvas — Peacock teal flows across it as accent, not as the identity ground. The Paper canvas is the secondary mode reserved for users who prefer light. 

#### `forbiddenTreatment` → `logo`

- **treatments:** stretched, rotated, recolored, drop-shadow, gradient-fill, on-busy-photo

> Perplexity's wordmark and citation glyph are precise brand assets. Recoloring, skewing, or applying gradient fills conflicts with the brand's reference-grade, citation-first posture where every visual element is exact. 

### ⚠️ warning (4)

#### `enumMembership` → `typography.heading.fontWeight`

- **allowed:** 400, 500, 600, 700

> FK Grotesk Neue is delivered on perplexity.ai with Regular (400), Medium (500), SemiBold (600), and Bold (700) cuts. The marketing and product surfaces use 400 for body, 500–600 for emphasis, and 700 for hero headings. Display weights outside this band are not in the licensed variable-font cut. 

#### `fontPairing` → `typography.display`

- **requires:** `serif`
- **minSizeRatio:** `1.5`

> FK Grotesk Neue pairs with Newsreader serif on perplexity.ai — sans for interface chrome and citation rails, serif for long-form answer body prose. A 1.5× minimum display-to-serif size ratio preserves the typographic hierarchy when an answer renders headings, body, and citations together. 

#### `contextRestriction` → `roles.colors.accent`

- **forbiddenContexts:** large-fill, hero-background
- **allowedContexts:** link, focus-ring, data-viz-primary, citation-marker, cta

> Peacock teal is the link / citation / CTA color on perplexity.ai — bright, small-area, attention-drawing. Large peacock background fills conflict with the brand's Inky-canvas dark posture where the teal is a directional signal, not a flood fill. 

#### `accessibilityRequirement` → `*`

- **standard:** `WCAG-AAA`
- **criterion:** `1.4.6`

> WCAG 2.1 Success Criterion 1.4.6 (Contrast Enhanced) — Level AAA. The brand's dense citation-rail and long-form sourced answer surface justifies the enhanced 7:1 target rather than the AA 4.5:1 floor. 

### 💡 recommendation (1)

#### `compositionConstraint` → `roles.colors.primary`

- **pairsWith:** inky, inky-deep, paper, paper-warm
- **doesNotPairWith:** marigold, rust, ember

> Peacock teal reads cleanest against the dark Inky canvas or the warm Paper canvas. Placing it adjacent to marigold, rust, or ember introduces a warm-cool chromatic conflict that fights for attention — these accents belong in separated regions (citations vs. status indicators vs. destructive confirmations), not as adjacent foreground/ background pairs. 

## Provenance

- **Source:** <https://www.perplexity.ai/>
- **License:** `Proprietary — All Rights Reserved`
- **Attribution:** Perplexity AI, Inc. — visual identity captured from the deployed stylesheet on perplexity.ai (OKLCH token families --pale-cyan-*, --pale-yellow-*, --costa-*, --pale-blue-*) and the docs.perplexity.ai documentation surface (rendered accent-button colors). Perplexity, the Perplexity wordmark, and associated marks are property of Perplexity AI, Inc. 
- **Imported:** `2026-05-18`
- **Notes:** Derived from live site CSS at https://www.perplexity.ai/ on 2026-05-18 (theme-color meta tags and the /_spa/assets/ spa-shell-*.css bundle) and from https://docs.perplexity.ai/ where the same peacock teal renders as the primary button. No public brand guide located. The proprietary FK Grotesk Neue, Newsreader serif, and Berkeley Mono faces are declared on perplexity.ai via @font-face but are not publicly distributed. This atom references space-grotesk@1 as the open-source rendering substitute for the sans/display role, pt-serif@1 as the substitute for the serif role used in answer body prose, and geist-mono@1 as the substitute for the mono role. 

---

*Generated by the brand-atoms converter. Source: `perplexity@1.0.0` from the encyclopedia.*
