---
name: Joshuakaplan
description: "This site is a perfect example of a data-driven, typographic portfolio where the structure itself becomes the primary design element."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#000000"
  secondary: "rgba(0,0,0,0.75)"
  tertiary: "#CDFF8B"
  neutral: "rgba(0,0,0,0.5)"
  muted-soft: "rgba(0,0,0,0.7)"
  line: "rgba(0,0,0,0.75)"

typography:
  display:
    fontFamily: sans-serif
    fontSize: 16px
    lineHeight: 1.0
    fontWeight: 500
    letterSpacing: "normal"
  body:
    fontFamily: sans-serif
    fontSize: 12px
    lineHeight: 1.17
    fontWeight: 500
    letterSpacing: "normal"

rounded:
  sm: 0px
  md: 0px
  lg: 0px
  pill: 20px

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

---

## Overview

A highly structured, typographically-driven designer portfolio that prioritizes information hierarchy through a clean, grid-based layout.

*A meticulously organized design portfolio, functioning like a structured index or ledger.*

## Colors

A stark, high-contrast palette of black and white, using a single bright lime green accent for status indicators.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`rgba(0,0,0,0.75)`)** — uses `ink-soft` token
- **Accent (`#CDFF8B`)** — uses `accent` token
- **Muted (`rgba(0,0,0,0.5)`)** — uses `muted` token
- **Borders (`rgba(0,0,0,0.75)`)** — uses `line` token

## Typography

- **Display:** sans-serif
- **Body:** sans-serif

- All text uses a medium weight (500) sans-serif font.
- Line height is very tight, often around 1.0 to 1.2.
- Font size is consistently small, with 16px and 12px being the primary sizes.

## Layout

A single-column vertical stack of rows, with rows divided into 4 columns of varying widths.

*Rhythm:* Tight, consistent 8px padding is used within grid cells, with horizontal rules defining major sections.

## Elevation & Depth

- Borders: 1px solid rgba(0,0,0,0.75) horizontal rules are used extensively to separate rows and sections.

## Shapes

- `sm`: 0px
- `md`: 0px
- `lg`: 0px
- `pill`: 20px

## Components

- **button:** Text links with no visual button styling, functioning as navigation.
- **card:** Rows act as data cards, with content organized into aligned columns.
- **chip:** Pill-shaped status indicators (e.g., '✓ Acquired') with a bright lime green background.
- **hero:** A text-only header introducing the designer and providing navigation links.

## Do's and Don'ts

**Don't:**
- Don't use rounded corners on containers — the screenshot shows sharp 90-degree corners on all rows and sections.
- Don't use drop shadows or elevation — the screenshot shows a completely flat design with no shadows.
- Don't use multiple accent colors — the screenshot shows a monochrome palette with only one lime green accent for status pills.
- Don't use large, varied typography — the screenshot shows a very tight typographic scale with minimal size variation.
- Don't use heavy borders or boxes — the screenshot shows only thin, single-pixel horizontal rules for separation.
- Don't use decorative imagery or background patterns — the screenshot shows a plain white background with no imagery except for logos.

---

## System Prompt (paste into AI agent)

```
This is a highly structured, minimalist designer portfolio. It uses a stark, high-contrast black-and-white palette with a single lime green accent (#CDFF8B) for status indicators. Typography is exclusively a medium-weight sans-serif, used in a very tight scale (16px and 12px) with a line height of around 1.0 to 1.2. The layout is a systematic, single-column grid of rows divided into four aligned columns, defined by thin horizontal rules. Key critical donts: Do not use rounded corners on main containers. Do not add drop shadows or elevation effects. Do not introduce multiple accent colors or decorative imagery. The design is purely typographic and structural.
```