---
name: Bear
description: "An excellent reference for restrained, text-first product design that prioritizes focus and clarity over visual noise."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#444444"
  tertiary: "#DD4C4F"
  neutral: "#888888"
  line: "rgba(68,68,68,1)"

typography:
  display:
    fontFamily: humanist-sans
    fontSize: 56px
    lineHeight: 1.0
    fontWeight: 700
    letterSpacing: "-1px"
  heading:
    fontFamily: humanist-sans
    fontSize: 40px
    lineHeight: 1.1
    fontWeight: 700
    letterSpacing: "0"
  body:
    fontFamily: humanist-sans
    fontSize: 16px
    lineHeight: 1.7
    fontWeight: 400
    letterSpacing: "0"
  caption:
    fontFamily: humanist-sans
    fontSize: 14px
    lineHeight: 1.6
    fontWeight: 400
    letterSpacing: "0"

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 focused markdown notes app with a refined, text-first interface.

*A clean, modern notebook designed for the Apple ecosystem*

## Colors

Clean white canvas with high-contrast text and a single warm red accent for the brand.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#444444`)** — uses `ink` token
- **Accent (`#DD4C4F`)** — uses `accent` token
- **Muted (`#888888`)** — uses `muted` token
- **Borders (`rgba(68,68,68,1)`)** — uses `line` token

## Typography

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

- Headlines use a clean, humanist sans-serif with tight tracking
- Body text uses the same family with generous line height for readability
- Monospace is reserved strictly for code snippets and technical references

## Layout

Single column centered layout with alternating content and app screenshot sections

*Rhythm:* Generous 64px vertical rhythm between major sections

## Elevation & Depth

- 0px 13px 34px 0px rgba(0, 0, 0, 0.12)
- 0px -5px 15px 1px rgba(0, 0, 0, 0.2)
- Borders: 1px solid #444444

## Shapes

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

## Components

- **button:** Simple pill or rounded rect with thin border and transparent background
- **card:** Clean white cards with subtle drop shadows, sometimes floating over colored backgrounds
- **chip:** Simple rounded tags used for app categories
- **input:** Minimal text inputs with subtle bottom borders
- **hero:** Centered text with device selector and large app screenshot floating below

## Do's and Don'ts

**Don't:**
- Don't use dark mode as the primary surface — screenshot shows a clean white background
- Don't use heavy drop shadows — screenshot shows very subtle, large-radius shadows
- Don't use dense, multi-column layouts — screenshot shows a centered, single-column text flow
- Don't use aggressive gradient backgrounds — screenshot shows solid colors or simple organic shapes
- Don't use thick, heavy borders — screenshot shows very thin, subtle borders or none at all
- Don't use complex animations — screenshot shows a static, calm interface

---

## System Prompt (paste into AI agent)

```
Bear is a focused, markdown notes app designed for the Apple ecosystem. The design DNA is characterized by extreme restraint, a clean white canvas, and a single warm red accent (#DD4C4F). The typography uses a refined humanist sans-serif (bearsans/bearsansheadline) for both display and body, with a bold, tight-tracked hero headline. The layout is strictly single-column and centered, with generous vertical rhythm (64px) and wide margins. Critical donts: never use dark mode as the primary surface, avoid heavy drop shadows, never use aggressive gradients, never clutter the interface with dense multi-column layouts, and keep all borders thin and subtle. The interaction model is minimal, relying on hover states and subtle transitions rather than complex motion. The voice is friendly and understated, focusing on the app's core benefit of clean, markdown-based writing.
```