---
name: Davejreid
description: "This site is a strong example of a refined, editorial portfolio that uses typography and whitespace effectively to create a premium feel without complex UI."
version: alpha

colors:
  background: "#F5F6F7"
  primary: "#222222"
  neutral: "#999999"
  line: "rgba(34,34,34,0.1)"

typography:
  display:
    fontFamily: old-style-serif
    fontSize: 16px
    lineHeight: 1.25
    fontWeight: 400
    letterSpacing: "-0.02em"

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

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

---

## Overview

A refined portfolio for a UI/UX and creative director, emphasizing typography and curated imagery.

*A clean, high-end magazine spread showcasing design work.*

## Colors

High-contrast minimalism with a neutral canvas that lets portfolio imagery pop.

- **Background (`#F5F6F7`)** — uses `bg` token
- **Primary text (`#222222`)** — uses `ink` token
- **Muted (`#999999`)** — uses `muted` token
- **Borders (`rgba(34,34,34,0.1)`)** — uses `line` token

## Typography

- **Display:** old-style-serif
- **Body:** humanist-sans

- Use old-style-serif for primary narrative elements and headers.
- Use humanist-sans for UI elements and secondary text.

## Layout

Large, full-bleed or wide imagery separated by generous vertical whitespace.

*Rhythm:* generous vertical whitespace between major sections

## Elevation & Depth

- Borders: none or extremely subtle

## Shapes

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

## Components

- **button:** Minimal text links with arrow icons (↗), no solid backgrounds.
- **card:** Large photographic cards with simple typography below.
- **chip:** None visible.
- **input:** None visible.
- **hero:** A simple text block with a bio and navigation links, followed by a large image.

## Do's and Don'ts

**Don't:**
- don't use bold, sans-serif headlines — screenshot shows a refined old-style serif instead
- don't use bright, saturated accent colors — screenshot shows a strictly neutral palette of grays
- don't use heavy shadows or cards — screenshot shows flat imagery against a plain background
- don't crowd elements together — screenshot shows significant vertical whitespace between sections
- don't use complex navigation — screenshot shows a minimal set of text links with arrows
- don't use modern geometric sans-serif for primary text — screenshot shows humanist-sans and serif fonts

---

## System Prompt (paste into AI agent)

```
This is a refined, editorial portfolio website for a UI/UX and creative director based in Hong Kong. The design DNA is defined by high-contrast minimalism, using a neutral off-white (#F5F6F7) background and dark charcoal (#222222) ink. Typography is the focal point, pairing an old-style-serif for display text with a humanist-sans for body elements. Critical donts include: do not use bright accent colors, do not use heavy shadows or modern geometric sans-serifs, and do not crowd elements with insufficient whitespace.
```