---
name: Novu
description: "Worth including as a prime example of modern developer-focused dark-mode SaaS design, blending high technicality with a sophisticated visual identity."
version: alpha

colors:
  background: "#111018"
  primary: "#ffffff"
  secondary: "#999999"
  tertiary: "#00d5ff"
  neutral: "#cccccc"
  bg-soft: "#1e2438"
  line: "rgba(255,255,255,0.1)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 64px
    lineHeight: 1.05
    fontWeight: 500
    letterSpacing: "-1px"
  body:
    fontFamily: geometric-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "0px"

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

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

---

## Overview

A dark-mode, developer-focused notification infrastructure platform combining clean typography with a sophisticated, deep space-inspired color palette.

*A developer-first command center for notifications, merging a sophisticated dark aesthetic with a clean, technical interface.*

## Colors

High-contrast dark mode foundation with cyan accents, relying on deep blues and grays for depth and layering.

- **Background (`#111018`)** — uses `bg` token
- **Primary text (`#ffffff`)** — uses `ink` token
- **Secondary text (`#999999`)** — uses `ink-soft` token
- **Accent (`#00d5ff`)** — uses `accent` token
- **Muted (`#cccccc`)** — uses `muted` token
- **Borders (`rgba(255,255,255,0.1)`)** — uses `line` token

## Typography

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

## Layout

Centered hero section followed by multi-column feature grids and complex overlapping UI demos.

*Rhythm:* 4px base grid with consistent vertical spacing.

## Elevation & Depth

- 0 0 100px rgba(0, 213, 255, 0.15)
- Borders: 1px solid rgba(255,255,255,0.1)

## Shapes

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

## Components

- **button:** Pill-shaped solid primary buttons (white with black text) and outlined secondary buttons.
- **card:** Dark-themed cards with subtle borders and soft radial gradients for depth.
- **chip:** Small pill badges with solid backgrounds for counts (e.g., yellow/orange '18').
- **input:** Dark-themed inputs with subtle borders.
- **hero:** Massive centered typography with overlapping floating interface components.

## Do's and Don'ts

**Don't:**
- don't use light backgrounds — screenshot shows a deep dark mode foundation (#111018).
- don't use decorative serif fonts — screenshot shows clean, geometric sans-serif typography.
- don't avoid code syntax in headlines — screenshot shows '<Inbox />' used prominently in the hero.
- don't use muted, low-contrast colors — screenshot shows high-contrast white text on dark backgrounds with bright cyan accents.
- don't use complex, multi-colored gradients everywhere — screenshot shows subtle, dark radial gradients for depth.
- don't use sharp, boxy corners — screenshot shows widespread use of pill-shaped (9999px) and 12px rounded corners.

---

## System Prompt (paste into AI agent)

```
Novu is a dark-mode, developer-first notification infrastructure platform. It features a deep dark background (#111018) with high-contrast white text (#ffffff) and bright cyan accents (#00d5ff). The typography is a clean geometric sans-serif category with large, bold headings and a technical tone, often incorporating code-like syntax. The design emphasizes complex UI demos, pill-shaped buttons, and subtle radial gradients. Critical donts: never use light backgrounds, never use decorative serifs, and never avoid code-centric headlines. Maintain a high-contrast, technical aesthetic suitable for a developer audience.
```