---
name: Ingmarcoenen
description: "A masterclass in minimalist portfolio design, using extreme scale and strict monochrome to create a memorable and professional presence."
version: alpha

colors:
  background: "#ffffff"
  primary: "#000000"
  secondary: "#3a4042"
  neutral: "#919191"
  bg-soft: "#f2f2f2"
  muted-soft: "#cccccc"
  line: "rgba(0,0,0,1.0)"

typography:
  display:
    fontFamily: display-sans
    fontSize: 295px
    lineHeight: 0.9
    fontWeight: 400
    letterSpacing: "-0.24px"
  body:
    fontFamily: neo-grotesque-sans
    fontSize: 13px
    lineHeight: 1.1
    fontWeight: 400
    letterSpacing: "-0.26px"
  heading:
    fontFamily: neo-grotesque-sans
    fontSize: 36px
    lineHeight: 0.94
    fontWeight: 400
    letterSpacing: "-0.26px"

rounded:
  sm: 4px
  md: 12px
  lg: 12px
  pill: 100px

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

---

## Overview

A bold, monochromatic portfolio site anchored by massive custom typography and clean minimalism.

*High-contrast editorial portfolio with extreme typographic scale*

## Colors

High-contrast monochrome with occasional photography

- **Background (`#ffffff`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`#3a4042`)** — uses `ink-soft` token
- **Muted (`#919191`)** — uses `muted` token
- **Borders (`rgba(0,0,0,1.0)`)** — uses `line` token

## Typography

- **Display:** display-sans
- **Body:** neo-grotesque-sans
- **Mono:** serif

## Layout

Asymmetrical grid with massive top-aligned hero and offset content blocks

*Rhythm:* Asymmetrical with generous whitespace

## Elevation & Depth

- Borders: 1px solid black for active states, otherwise borderless

## Shapes

- `sm`: 4px
- `md`: 12px
- `lg`: 12px
- `pill`: 100px

## Components

- **button:** Pill-shaped or rounded rectangular with subtle backgrounds
- **card:** Full-bleed image cards with rounded corners
- **chip:** Small rounded pill indicators for active states
- **input:** Full-width rounded input fields with light backgrounds
- **hero:** Extreme oversized typography dominating the viewport

## Do's and Don'ts

**Don't:**
- Don't use a multi-color palette — screenshot shows strictly monochrome elements
- Don't use small display typography — screenshot shows massive, viewport-filling hero text
- Don't use heavy drop shadows — screenshot shows completely flat surfaces
- Don't use rigid grid alignments — screenshot shows offset, asymmetrical layouts
- Don't use complex icon sets — screenshot shows minimal, custom text-based branding
- Don't use standard serif fonts for body text — screenshot shows a condensed serif only for the main intro paragraph

---

## System Prompt (paste into AI agent)

```
This is a high-contrast, monochromatic portfolio site for a digital design director. The design DNA is defined by extreme typographic scale using custom display fonts and a neo-grotesque sans-serif for UI elements. Key colors are pure black (#000000) on a white (#ffffff) or light gray (#f2f2f2) background. The layout is asymmetrical and generous with whitespace, using 12px and 4px border-radii for UI components. Critical donts include: don't use multi-color palettes, don't use small display typography, and don't use heavy shadows. The tone is professional, direct, and personal, focusing on the work rather than flashy visual effects.
```
