---
name: Doppler
description: "Exemplary dark mode developer tool aesthetic with strong brand consistency"
version: alpha

colors:
  background: "#1C1624"
  primary: "#F1F0EC"
  secondary: "#D0C9C4"
  tertiary: "#00F575"
  neutral: "#55505B"
  bg-soft: "#2D2734"
  line: "rgba(255, 255, 255, 0.08)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 56px
    lineHeight: 1.0
    fontWeight: 500
    letterSpacing: "-1px"
  display-sm:
    fontFamily: geometric-sans
    fontSize: 32px
    lineHeight: 1.2
    fontWeight: 500
    letterSpacing: "-0.64px"
  body:
    fontFamily: humanist-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "0.15px"

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

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

---

## Overview

Secure secrets management for engineering teams

*A fortified vault for digital secrets*

## Colors

High contrast neon on dark with subtle purple gradients

- **Background (`#1C1624`)** — uses `bg` token
- **Primary text (`#F1F0EC`)** — uses `ink` token
- **Secondary text (`#D0C9C4`)** — uses `ink-soft` token
- **Accent (`#00F575`)** — uses `accent` token
- **Muted (`#55505B`)** — uses `muted` token
- **Borders (`rgba(255, 255, 255, 0.08)`)** — uses `line` token

## Typography

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

- Use geometric sans for headlines
- Use humanist sans for body text
- Maintain tight letter spacing for large display text

## Layout

Full-width hero with centered content, two-column feature sections

*Rhythm:* 8px grid system with 32px base increments

## Elevation & Depth

- 0 4px 12px rgba(0, 0, 0, 0.15)
- 0 8px 24px rgba(0, 0, 0, 0.2)
- Borders: 1px solid rgba(255, 255, 255, 0.08)

## Shapes

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

## Components

- **button:** Solid neon green (#00F575) with dark text, rounded corners, hover states
- **card:** Dark glass panels with subtle borders and rounded corners
- **chip:** Small status indicators with rounded corners
- **input:** Dark background with subtle borders, search functionality
- **hero:** Large gradient background with floating UI mockup and bold headline

## Do's and Don'ts

**Don't:**
- Don't use light backgrounds — screenshot shows dark purple/black theme
- Don't use multiple accent colors — screenshot shows single neon green accent
- Don't use serif fonts — screenshot shows geometric/humanist sans fonts
- Don't use small, cramped spacing — screenshot shows generous padding (32-70px)
- Don't use sharp corners — screenshot shows rounded corners (8-20px radius)
- Don't use muted, low-contrast colors — screenshot shows high contrast neon on dark

---

## System Prompt (paste into AI agent)

```
Doppler is a premium developer tool for secrets management with a dark, security-focused aesthetic. The design uses deep purple-black backgrounds (#1C1624) with neon green accents (#00F575) for high visibility CTAs. Typography features geometric sans for display and humanist sans for body text. The layout centers around a strong hero with floating UI mockup, using generous spacing (32-70px padding) and rounded corners (8-20px). Key features include gradient backgrounds, glass-morphism cards, and smooth 0.3s transitions. Critical donts: avoid light backgrounds, multiple accent colors, serif fonts, cramped spacing, sharp corners, and low-contrast palettes. The system targets enterprise engineering teams needing secure, scalable secrets management across CI/CD pipelines.
```