---
name: Daniellelevitt
description: "This site is an excellent example of a bold, expressive portfolio that uses extreme typography and an unconventional layout to elevate editorial photography."
version: alpha

colors:
  background: "#F9F7F7"
  primary: "#392E2B"
  tertiary: "#F1B5C2"
  bg-quiet: "#392E2B"
  line: "rgba(57, 46, 43, 1)"

typography:
  display:
    fontFamily: grotesque-sans
    fontSize: 130px
    lineHeight: 0.85
    fontWeight: 800
    letterSpacing: "-1.3px"
  headline:
    fontFamily: grotesque-sans
    fontSize: 72px
    lineHeight: 0.95
    fontWeight: 800
    letterSpacing: "-0.72px"
  body:
    fontFamily: grotesque-sans
    fontSize: 29px
    lineHeight: 0.95
    fontWeight: 800
    letterSpacing: "-0.29px"

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

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

---

## Overview

An expressive photography agency portfolio for documenting music, art, fashion, and celebrity.

*A high-end editorial magazine's digital portfolio*

## Colors

A stark, high-contrast palette where bold, pastel pink accents and massive typography interact with a clean canvas to frame vibrant editorial photography.

- **Background (`#F9F7F7`)** — uses `bg` token
- **Primary text (`#392E2B`)** — uses `ink` token
- **Accent (`#F1B5C2`)** — uses `accent` token
- **Borders (`rgba(57, 46, 43, 1)`)** — uses `line` token

## Typography

- **Display:** grotesque-sans
- **Body:** grotesque-sans

- All typography is set to an extreme heavy weight (800)
- Letter spacing is always tight to negative
- Line height is exceptionally tight for display sizes

## Layout

A gridless, asymmetric collage where images overlap massive background typography

*Rhythm:* Asymmetric and loose to accommodate overlapping images and massive type

## Elevation & Depth

- Borders: No borders used; separation is achieved through whitespace and type hierarchy

## Shapes

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

## Components

- **button:** Text-based navigation links with no background or borders
- **card:** Photography frames without borders, shadows, or containers
- **hero:** A full-width collage of overlapping editorial images and massive typography

## Do's and Don'ts

**Don't:**
- Don't use multiple font families — screenshot shows a single grotesque-sans family used exclusively for all text
- Don't use rounded containers or cards — screenshot shows sharp, unstyled photographic frames
- Don't use soft drop shadows — screenshot shows completely flat typography and photography
- Don't use uppercase text — screenshot shows exclusively lowercase text for headings and navigation
- Don't use standard grid spacing — screenshot shows an asymmetric, collage-based layout
- Don't use a dark primary background — screenshot shows a light #F9F7F7 background with a dark #392E2B footer section

---

## System Prompt (paste into AI agent)

```
This is an expressive photography agency portfolio for Danielle Levitt, focusing on music, art, fashion, and celebrity. The design is a bold, asymmetric collage that pairs massive, tightly tracked grotesque-sans typography (#392E2B, weight 800) with vibrant editorial photography. A signature pastel pink (#F1B5C2) acts as a high-chroma accent for text and graphic elements, standing out against the light #F9F7F7 canvas. Critical constraints: use only a single, heavy grotesque-sans font family; avoid uppercase text; use no borders, shadows, or rounded corners; and maintain a loose, asymmetric layout that allows images and type to overlap freely. Interactions should be smooth, using a 0.5s cubic-bezier transition for color and opacity changes.
```