---
name: Pulumi
description: "A strong example of a modern, developer-focused SaaS site that balances professional authority with approachability."
version: alpha

colors:
  background: "#ffffff"
  primary: "#1f1b21"
  secondary: "#2e293a"
  tertiary: "#5a31c5"
  neutral: "#6b6573"
  bg-soft: "#f5f5ff"
  line: "rgba(224, 223, 226, 1.0)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 56px
    lineHeight: 1.0
    fontWeight: 600
    letterSpacing: "-2.4px"

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

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

---

## Overview

Infrastructure as code for cloud engineers.

*A high-performance engine for cloud infrastructure, combining power with approachability.*

## Colors

Clean white space with deep purple accents to establish a premium, professional feel.

- **Background (`#ffffff`)** — uses `bg` token
- **Primary text (`#1f1b21`)** — uses `ink` token
- **Secondary text (`#2e293a`)** — uses `ink-soft` token
- **Accent (`#5a31c5`)** — uses `accent` token
- **Muted (`#6b6573`)** — uses `muted` token
- **Borders (`rgba(224, 223, 226, 1.0)`)** — uses `line` token

## Typography

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

- Use tight letter-spacing (-1.8px to -2.4px) for large display headings.
- Use Inter for body text and UI elements.
- Use Monaspace Neon for code snippets.

## Layout

Standard 12-column grid.

*Rhythm:* Consistent 4px base unit for all spacing.

## Elevation & Depth

- 0px 10px 15px -3px rgba(0, 0, 0, 0.1)
- 0px 4px 6px -4px rgba(0, 0, 0, 0.1)
- Borders: 1px solid #e0dfe2

## Shapes

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

## Components

- **button:** Solid purple for primary actions, outlined for secondary.
- **card:** White background with 1px border and 8px radius.
- **chip:** Pill-shaped with thin border.
- **input:** Clean, single-pixel border.
- **hero:** Split layout with large typography on the left and interactive visualization on the right.

## Do's and Don'ts

**Don't:**
- Don't use a dark background for the main page — the screenshot shows a predominantly white (#ffffff) background.
- Don't use sans-serif fonts for code — the screenshot uses Monaspace Neon, a monospace font.
- Don't use rounded pill shapes for primary buttons — the screenshot shows buttons with an 8px border radius.
- Don't use multiple high-chroma accent colors — the screenshot shows a single dominant purple (#5a31c5) accent.
- Don't use wide letter-spacing for display typography — the screenshot uses tight tracking (-2.4px).
- Don't use heavy drop shadows on all surfaces — the screenshot uses subtle box-shadows only on certain cards.

---

## System Prompt (paste into AI agent)

```
This is a developer-focused SaaS platform for infrastructure as code. The design is clean and professional, using a white background with a deep purple (#5a31c5) as the primary accent color. Typography uses Inter (humanist-sans) for body text and Monaspace Neon (monospace) for code. Critical donts: don't use a dark main background, don't use sans-serif for code blocks, and don't use wide letter-spacing for display type. The layout is spacious and structured, emphasizing clarity and trust.
```
