---
name: Tparkes
description: "This site is a great example of how to use typography and whitespace to create a professional, high-impact personal portfolio without relying on color."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#333333"
  neutral: "#A7A7A7"
  line: "rgba(51, 51, 51, 1)"

typography:
  display:
    fontFamily: sans-serif
    fontSize: 86px
    lineHeight: 1.0
    fontWeight: 600
    letterSpacing: "-3px"

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

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

---

## Overview

A personal digital design lead portfolio showcasing brand and website work.

*A clean, professional digital portfolio with bold, expressive typography.*

## Colors

High-contrast monochrome palette relying on typographic scale rather than color accents.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#333333`)** — uses `ink` token
- **Muted (`#A7A7A7`)** — uses `muted` token
- **Borders (`rgba(51, 51, 51, 1)`)** — uses `line` token

## Typography

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

## Layout

Full-width hero section with left-aligned text and a top navigation bar.

*Rhythm:* Generous whitespace and padding emphasize the large-scale typography.

## Elevation & Depth

- Borders: Subtle borders using primary text color, often used on cards or UI elements.

## Shapes

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

## Components

- **button:** Minimal text links or icon-based buttons (e.g., hamburger menu, 'Explore my work').
- **card:** Large, full-width image/video cards with rounded corners.
- **hero:** Dominant typographic statement with inline graphic icons and a large monochrome image.

## Do's and Don'ts

**Don't:**
- Don't use colorful gradients — the screenshot shows a strict monochrome palette.
- Don't use serif fonts — the typography is strictly sans-serif.
- Don't hide navigation — the hamburger menu is prominent on mobile.
- Don't use small, cramped text — the hero type is massive (86px).
- Don't use busy backgrounds — the background is clean white.
- Don't use heavy shadows — surfaces are flat and clean.

---

## System Prompt (paste into AI agent)

```
This is a personal digital design portfolio with a clean, monochrome aesthetic. It uses a large sans-serif display font (86px) for bold statements, accented by small, high-contrast black icons. The primary colors are white (#FFFFFF) for the background, dark grey (#333333) for ink, and light grey (#A7A7A7) for muted elements. Key hex colors include #333333, #A7A7A7, and #FFFFFF. Critical constraints: Never use colorful accents, serif fonts, or complex UI patterns. The layout is spacious, relying on generous whitespace and a single-column container. Navigation is minimal, focusing on the work showcase.
```