---
name: Footer
description: "A refined curation platform that demonstrates how strict restraint in color and typography can create a sophisticated editorial presentation."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#242424"
  secondary: "rgba(36,36,36,0.64)"
  neutral: "#737373"
  bg-soft: "#F2F2F2"
  line: "rgba(36,36,36,0.12)"

typography:
  display:
    fontFamily: grotesque-sans
    fontSize: 32px
    lineHeight: 1.0
    fontWeight: 600
    letterSpacing: "-1.28px"

rounded:
  sm: 4px
  md: 8px
  lg: 1600px
  pill: 1600px

spacing:
  xs: 4px
  sm: 8px
  md: 12px
  lg: 16px
  xl: 24px
  2xl: 40px
  3xl: 60px

---

## Overview

A curated design gallery focusing on bold typography and editorial presentation.

*A clean, typographic gallery curation platform*

## Colors

Strictly monochromatic with high contrast between white space and dark text

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#242424`)** — uses `ink` token
- **Secondary text (`rgba(36,36,36,0.64)`)** — uses `ink-soft` token
- **Muted (`#737373`)** — uses `muted` token
- **Borders (`rgba(36,36,36,0.12)`)** — uses `line` token

## Typography

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

- Primary text uses 18px with -0.54px tracking
- Secondary text uses 14px with -0.42px tracking
- Headings use 600 weight
- Body text uses 400 weight

## Layout

Multi-column grid layout for gallery cards

*Rhythm:* Consistent spacing increments of 4, 8, 12, 16, 24, 40, 60

## Elevation & Depth

- Borders: 1px solid rgba(36,36,36,0.12) on cards and buttons

## Shapes

- `sm`: 4px
- `md`: 8px
- `lg`: 1600px
- `pill`: 1600px

## Components

- **button:** Pill-shaped with 1600px border radius, black or white fill
- **card:** Image-heavy with minimal borders and clear typography
- **chip:** Small rounded tags for filtering
- **hero:** Large typographic introduction with subtle animations

## Do's and Don'ts

**Don't:**
- Don't use vibrant accent colors — screenshot shows strictly monochromatic palette
- Don't use rounded corners except for pill buttons — screenshot shows sharp corners on cards
- Don't use drop shadows — screenshot shows flat, border-defined surfaces
- Don't use decorative fonts — screenshot uses clean grotesque and humanist sans-serifs
- Don't create dense layouts — screenshot uses generous white space and clear hierarchy
- Don't use multiple font families — screenshot relies primarily on Inter with varying weights

---

## System Prompt (paste into AI agent)

```
A minimalist design curation gallery focusing on editorial presentation of web design work. The palette is strictly monochromatic using #FFFFFF backgrounds, #F2F2F2 soft backgrounds, #242424 primary ink, and rgba(36,36,36,0.64) secondary text. Typography uses Inter (humanist-sans for body, grotesque-sans for display) with tight letter spacing. Critical don'ts: avoid vibrant accent colors, avoid rounded corners except on pill buttons, avoid drop shadows, avoid decorative fonts, avoid dense layouts, avoid multiple font families. The design emphasizes clean lines, generous spacing, and clear typographic hierarchy for showcasing curated design work.
```