---
name: Gumroad
description: "An excellent example of a clean, modern, and friendly SaaS platform design."
version: alpha

colors:
  background: "#F4F4F0"
  primary: "#000000"
  neutral: "#999999"
  line: "rgba(0,0,0,0.1)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 48px
    lineHeight: 1.0
    fontWeight: 500
    letterSpacing: "-0.4px"

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

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

---

## Overview

A platform enabling creators to sell directly to their audience.

*An inviting digital marketplace for independent creators.*

## Colors

High contrast with a warm neutral base and playful accents.

- **Background (`#F4F4F0`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Muted (`#999999`)** — uses `muted` token
- **Borders (`rgba(0,0,0,0.1)`)** — uses `line` token

## Typography

- **Display:** geometric-sans
- **Body:** geometric-sans

## Layout

Centered hero section with floating 3D elements.

*Rhythm:* generous whitespace around central elements.

## Elevation & Depth

- Borders: thin 1px solid borders on inputs and some cards.

## Shapes

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

## Components

- **button:** solid black with white text, rounded corners.
- **card:** rounded corners, white background, thin border.
- **input:** rounded corners, thin border, white background.
- **hero:** centered text with large display font and a call to action.

## Do's and Don'ts

**Don't:**
- don't use a pure white background — screenshot shows a warm off-white (#F4F4F0) instead.
- don't use blue as an accent — screenshot shows pink/magenta decorative elements instead.
- don't use decorative serif fonts — screenshot shows geometric sans-serif fonts instead.
- don't use heavy drop shadows — screenshot shows flat design with thin borders instead.
- don't use complex gradients — screenshot shows solid colors and clean transitions instead.
- don't use overly dense layouts — screenshot shows generous whitespace and centered content instead.

---

## System Prompt (paste into AI agent)

```
This site is a SaaS platform for creators to sell digital products. The color palette uses a warm off-white background (#F4F4F0) with high-contrast black text (#000000) and playful pink accents. The typography is a geometric sans-serif (ABC Favorit) with tight letter-spacing (-0.4px) and bold display weights. Critical donts: never use pure white backgrounds; avoid blue accents; never use serif fonts; avoid heavy drop shadows; avoid complex gradients; avoid dense layouts. The layout is clean and centered, focusing on a clear call to action.
```
