fabian
Projects

2026 · In progress

Personal Portfolio

The site you are reading. An editorial take on a personal site — paper, ink, and one accent.

Role
Designer + builder
Stack
Next.js 16Tailwind v4MDXFraunces
Links
Repo
Personal Portfolio cover

Problem

Every personal site I started with the same defaults — Inter, zinc grays, a blue/cyan gradient, three feature cards under a centered hero — felt indistinguishable from the next one. The site should look like a thing I made, not a thing a template made.

Approach

A paper-and-ink palette in oklch with a single warm clay accent. Fraunces on opsz for display and reading, Geist for UI, JetBrains Mono for the meta typography. An asymmetric grid with content anchored flush-left and a slim metadata rail docked far right. One motion element — a blinking caret — and nothing else moving.

Learnings

  • Constraint compounds: once the palette is one accent, every place you reach for color becomes a deliberate decision.
  • A 5-minute hand-tuned type scale beats whatever Tailwind ships by default.
  • oklch plus color-mix makes derived tokens (glow, hover, subtle bg) a one-line change instead of a refactor.