---
name: Giopandone
description: "An excellent example of a restrained, Swiss-inspired design portfolio where typography and spacing dictate the hierarchy."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#000000"
  secondary: "rgba(0,0,0,0.45)"
  tertiary: "#1840E7"
  line: "rgba(0,0,0,0.1)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 56px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "-0.6px"
  body:
    fontFamily: neo-grotesque-sans
    fontSize: 13px
    lineHeight: 1.23
    fontWeight: 400
    letterSpacing: "0"
  caption:
    fontFamily: neo-grotesque-sans
    fontSize: 12.24px
    lineHeight: 1.63
    fontWeight: 400
    letterSpacing: "0"

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

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

---

## Overview

A restrained, typography-driven portfolio for a brand experience designer.

*A minimalist Swiss-style design portfolio.*

## Colors

Strict high-contrast monochrome with a single vibrant blue accent used sparingly for emphasis.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Secondary text (`rgba(0,0,0,0.45)`)** — uses `ink-soft` token
- **Accent (`#1840E7`)** — uses `accent` token
- **Borders (`rgba(0,0,0,0.1)`)** — uses `line` token

## Typography

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

## Layout

Strict grid with generous negative space and asymmetric alignments.

*Rhythm:* Strict 4px baseline grid with ample vertical whitespace.

## Elevation & Depth

- Borders: 1px solid rgba(0,0,0,0.1)

## Shapes

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

## Components

- **button:** Minimal text-based navigation links, uppercase, small font size.
- **card:** Full-width photographic cards with simple typography underneath.
- **hero:** Large, multi-column typographic layout with a massive logo and distinct spacing.

## Do's and Don'ts

**Don't:**
- Don't use rounded corners — screenshot shows sharp, square edges on all containers.
- Don't use drop shadows — screenshot shows flat surfaces without depth effects.
- Don't use multiple accent colors — screenshot shows only a single blue accent against monochrome.
- Don't use centered text layouts — screenshot shows left-aligned and asymmetric typography.
- Don't use busy backgrounds — screenshot shows stark white negative space.
- Don't use decorative borders — screenshot shows only functional, thin dividing lines.

---

## System Prompt (paste into AI agent)

```
This is a minimalist design portfolio for a brand experience designer. It features a strict monochrome palette (white #FFFFFF background, black #000000 text, muted rgba(0,0,0,0.45) secondary text) with a single vibrant blue accent (#1840E7). Typography relies on geometric and neo-grotesque sans-serif categories, with a massive display logo and small, uppercase navigation. The layout is highly structured, utilizing a strict 4px baseline grid, sharp square corners, and generous negative space. Critical donts: never use rounded corners, avoid drop shadows, never use multi-color palettes, avoid centered text, never use busy backgrounds, and avoid decorative borders.
```