---
name: Nofilter
description: "A strong example of minimalist editorial design, focusing on content and typography."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#333333"
  neutral: "#333333"
  line: "rgba(51, 51, 51, 1)"

typography:
  display:
    fontFamily: grotesque-sans
    fontSize: 120px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "-2px"
  heading:
    fontFamily: grotesque-sans
    fontSize: 35px
    lineHeight: 1.1
    fontWeight: 400
    letterSpacing: "0px"
  body:
    fontFamily: grotesque-sans
    fontSize: 24px
    lineHeight: 1.25
    fontWeight: 400
    letterSpacing: "0px"
  small:
    fontFamily: grotesque-sans
    fontSize: 15px
    lineHeight: 1.46
    fontWeight: 400
    letterSpacing: "0px"

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

A clean, typography-driven editorial platform for fashion and photography.

*High-end fashion magazine website*

## Colors

Monochrome palette emphasizing content through high-contrast black text on white.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#333333`)** — uses `ink` token
- **Muted (`#333333`)** — uses `muted` token
- **Borders (`rgba(51, 51, 51, 1)`)** — uses `line` token

## Typography

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

- Use pragmatica sans-serif for all text.
- Navigation links are uppercase.
- Author and date lines are set in a smaller body size.

## Layout

Grid-based editorial layout with large imagery and asymmetric columns.

*Rhythm:* Consistent padding and margin multiples of 4px.

## Elevation & Depth

- Borders: 1px solid rgb(51, 51, 51) on primary containers.

## Shapes

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

## Components

- **button:** Text links with uppercase styling and cursor pointer.
- **card:** Bordered containers for articles with large imagery.
- **chip:** None
- **input:** None
- **hero:** Large-scale typography title spanning the width.

## Do's and Don'ts

**Don't:**
- Don't use decorative fonts — screenshot shows pragmatica sans-serif throughout.
- Don't add background gradients — screenshot shows a solid white background.
- Don't use drop shadows on cards — screenshot shows flat, bordered containers.
- Don't use rounded corners — screenshot shows sharp, rectangular elements.
- Don't introduce vibrant accent colors — screenshot shows a monochrome palette.
- Don't clutter the layout with unnecessary elements — screenshot shows ample whitespace.

---

## System Prompt (paste into AI agent)

```
This is a premium fashion editorial website featuring a minimalist, monochrome design. The design relies on bold typography using a pragmatica sans-serif font and high-contrast imagery against a clean white background. Key colors are #FFFFFF for the background and #333333 for text and borders. Critical donts: Do not use decorative fonts; Do not add background gradients; Do not use drop shadows on cards; Do not use rounded corners; Do not introduce vibrant accent colors. The layout is grid-based, emphasizing large-scale typography and editorial photography.
```