---
name: Angelvaliente
description: "This site is a perfect example of 'less is more' in design studio portfolios, using extreme restraint to elevate the presented work."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#000000"
  secondary: "#565656"
  neutral: "#B4B4B4"
  bg-soft: "#F5F5F5"
  line: "rgba(0,0,0,0.75)"

typography:
  display:
    fontFamily: humanist-sans
    fontSize: 32px
    lineHeight: 1.3
    fontWeight: 400
    letterSpacing: "1.5px"
  body:
    fontFamily: humanist-sans
    fontSize: 17px
    lineHeight: 1.4
    fontWeight: 400
    letterSpacing: "1.3px"

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

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

---

## Overview

Minimalist design studio portfolio.

*A curated gallery of a design studio's work, prioritizing the object and the space.*

## Colors

Stark, high-contrast palette dominated by black and white with warm neutrals from photography.

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

## Typography

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

- All text is uppercase.
- Generous letter-spacing is applied to all text.
- Font weight is strictly regular (400).

## Layout

Asymmetric masonry or grid layout for portfolio items.

*Rhythm:* Consistent 26px padding applied to interactive elements.

## Elevation & Depth

- Borders: No visible UI borders; separation is achieved through layout and photography.

## Shapes

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

## Components

- **button:** Minimal text-based buttons or icons, often with a pointer cursor.
- **card:** Portfolio items presented as large photographic blocks with minimal text labels.
- **chip:** No chips present.
- **input:** No visible input fields in the provided screenshots.
- **hero:** Full-bleed, high-quality photography with overlay or adjacent minimal text.

## Do's and Don'ts

**Don't:**
- Don't use bold or italic typefaces — screenshot shows only regular weight text.
- Don't use decorative borders or boxes — screenshot shows a borderless, clean layout.
- Don't use a busy or multi-colored background — screenshot shows plain white or warm beige backgrounds.
- Don't use lowercase for navigation or titles — screenshot shows all text is uppercase.
- Don't use complex shadows or 3D effects — screenshot shows flat photography and UI.
- Don't use a high-chroma accent color — screenshot shows a neutral palette with color coming from photography.

---

## System Prompt (paste into AI agent)

```
This is a minimalist design studio portfolio website. The design DNA is defined by extreme restraint, prioritizing high-quality photography and a stark, high-contrast palette of white (#FFFFFF) and black (#000000). Typography uses a humanist-sans category (Favorit), set entirely in uppercase with wide letter-spacing (1.5px) and a regular weight (400). Key hex colors include #F5F5F5 for soft backgrounds and #565656 for secondary ink. Critical donts include: never use bold or italic text, never use decorative borders or boxy UI elements, and never introduce a high-chroma accent color that isn't present in the photography. The layout is spacious and gallery-like, with generous padding (26px) on interactive elements. The overall feel is sophisticated, architectural, and gallery-like.
```