---
name: Bastienallard
description: "This site is worth including as a prime example of a minimalist, typography-driven portfolio that prioritizes content and clarity over visual noise."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#000000"
  secondary: "rgba(0,0,0,0.8)"
  neutral: "#7F7F7F"
  line: "rgba(0,0,0,0.8)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 56px
    lineHeight: 1.0
    fontWeight: 540
    letterSpacing: "-1px"
  body:
    fontFamily: geometric-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 540
    letterSpacing: "-0.03px"

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

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

---

## Overview

A minimalist personal portfolio for a Senior Art Director, featuring a monochromatic palette and strong typographic presence.

*A clean, high-contrast editorial layout designed to showcase digital design expertise.*

## Colors

Extreme high-contrast monochrome with no accent colors, relying on typography and photography for visual hierarchy.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`rgba(0,0,0,0.8)`)** — uses `ink-soft` token
- **Muted (`#7F7F7F`)** — uses `muted` token
- **Borders (`rgba(0,0,0,0.8)`)** — uses `line` token

## Typography

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

- Use Diatype Variable for all UI text
- Maintain tight letter-spacing on headlines
- Use system fonts as fallbacks only

## Layout

A clean three-column footer layout with a wide, spacious main content area.

*Rhythm:* Generous white space with a strict 4px baseline grid.

## Elevation & Depth

- Borders: Subtle 1px borders using rgba(0,0,0,0.8) for separation.

## Shapes

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

## Components

- **button:** Minimalist text-based buttons without background fills.
- **card:** Image-heavy project cards with subtle typography overlays.
- **chip:** Simple text tags for categorization.
- **input:** Clean, borderless text inputs.
- **hero:** Large, high-impact typography paired with editorial photography.

## Do's and Don'ts

**Don't:**
- Don't use a dark mode — the screenshot shows a pure white background.
- Don't add bright accent colors — the palette is strictly monochrome.
- Don't use decorative serif fonts — the screenshot shows a geometric sans-serif throughout.
- Don't add heavy drop shadows — the surfaces are flat and rely on borders or typography for depth.
- Don't clutter the UI with many colors — it uses a strict black, white, and gray palette.
- Don't use rounded corners on everything — the design is sharp and architectural.

---

## System Prompt (paste into AI agent)

```
This is a minimalist portfolio for a Senior Art Director, featuring a monochromatic palette (black ink #000000, white background #FFFFFF, muted gray #7F7F7F). The typography is a geometric sans-serif (Diatype Variable) with tight letter-spacing on display sizes. The layout is spacious with generous white space and a clear editorial feel. Critical don'ts: Don't introduce bright accent colors, don't use decorative serifs, and don't clutter the interface with heavy shadows or complex UI components. The design relies on strong photography and bold typography to create impact.
```