---
name: Omnivore
description: "Worth including as a prime example of a distraction-free, human-centric design system that prioritizes content and readability above all else."
version: alpha

colors:
  background: "#FEFCF5"
  primary: "#3D3D3D"
  tertiary: "#FFD234"
  neutral: "#666666"
  line: "rgba(61, 61, 61, 1)"

typography:
  display:
    fontFamily: humanist-sans
    fontSize: 45px
    lineHeight: 1.25
    fontWeight: 700
    letterSpacing: "-0.5px"
  heading:
    fontFamily: humanist-sans
    fontSize: 32px
    lineHeight: 1.25
    fontWeight: 700
    letterSpacing: "-0.5px"
  body:
    fontFamily: humanist-sans
    fontSize: 18px
    lineHeight: 1.6
    fontWeight: 400
    letterSpacing: "0"
  small:
    fontFamily: humanist-sans
    fontSize: 14px
    lineHeight: 1.25
    fontWeight: 400
    letterSpacing: "0"

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

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

---

## Overview

A free, open-source read-it-later app designed for serious readers and lifelong learners.

*A private, distraction-free reading room for knowledge workers.*

## Colors

Warm, high-contrast palette prioritizing readability and focus over decoration.

- **Background (`#FEFCF5`)** — uses `bg` token
- **Primary text (`#3D3D3D`)** — uses `ink` token
- **Accent (`#FFD234`)** — uses `accent` token
- **Muted (`#666666`)** — uses `muted` token
- **Borders (`rgba(61, 61, 61, 1)`)** — uses `line` token

## Typography

- **Display:** humanist-sans
- **Body:** humanist-sans

- Maintain generous line-height for long-form readability.
- Use high contrast (dark grey on light background) for maximum legibility.
- Limit font weights to bold for headings and regular for body text.

## Layout

Centered, single-column content with generous margins.

*Rhythm:* Generous whitespace to support focus and reduce cognitive load.

## Elevation & Depth

- 0px 0px 0px 1px rgba(61, 61, 61, 1)
- Borders: Subtle 1px borders for structure and definition.

## Shapes

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

## Components

- **button:** Solid background fill (yellow), rounded corners, uppercase or bold text, no secondary outline buttons.
- **card:** Minimalist cards with subtle borders or background shifts.
- **chip:** Simple rounded tags for categorization.
- **input:** Clean, unadorned text fields with bottom borders.
- **hero:** Centered typography stack with a single primary call-to-action.

## Do's and Don'ts

**Don't:**
- Don't use drop shadows — screenshot shows flat, bordered elements instead.
- Don't use gradient backgrounds — screenshot shows solid, warm off-white and white backgrounds.
- Don't use decorative script fonts — screenshot shows clean, humanist sans-serif typography.
- Don't use dark mode by default — screenshot shows a light, paper-like theme.
- Don't use multiple competing accent colors — screenshot shows a single dominant yellow accent.
- Don't use dense, cluttered layouts — screenshot shows generous whitespace and a single-column flow.

---

## System Prompt (paste into AI agent)

```
A minimalist, distraction-free design system for a read-it-later application focused on privacy and open-source values. It uses a warm, off-white (#FEFCF5) background with dark grey (#3D3D3D) ink for high readability, supported by a single, vibrant yellow (#FFD234) accent for calls to action. Typography relies on humanist sans-serif categories with generous line-heights to prioritize long-form reading comfort. The layout is strictly centered and single-column, utilizing generous whitespace to reduce cognitive load. Critical constraints include: do not use dark mode as the default, do not introduce decorative gradients, do not use multiple competing accent colors, do not use dense, cluttered layouts, do not use drop shadows on components, and do not use complex, multi-column grids in the main content area.
```