---
name: 14islands
description: "Exemplary minimalist agency design that uses extreme typographic scale and restraint as its primary design language."
version: alpha

colors:
  background: "#F2F2F2"
  primary: "#070707"
  secondary: "#A2A2A9"
  neutral: "#A2A2A9"
  line: "rgba(7, 7, 7, 1)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 180px
    lineHeight: 0.8
    fontWeight: 400
    letterSpacing: "-9px"
  heading:
    fontFamily: humanist-sans
    fontSize: 100px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "-4px"
  subhead:
    fontFamily: humanist-sans
    fontSize: 75px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "-3px"
  body:
    fontFamily: humanist-sans
    fontSize: 16px
    lineHeight: 2.16
    fontWeight: 400
    letterSpacing: "0px"
  caption:
    fontFamily: humanist-sans
    fontSize: 12px
    lineHeight: 1.4
    fontWeight: 400
    letterSpacing: "0px"

rounded:
  sm: 4px
  md: 4px
  lg: 5px
  pill: 999px

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

---

## Overview

A minimalist design agency showcasing premium digital products and experiences through restrained typography and bold photography.

*A high-end architectural firm for digital products*

## Colors

Near-monochromatic palette relying on extreme typography scale and high-chroma project photography for impact.

- **Background (`#F2F2F2`)** — uses `bg` token
- **Primary text (`#070707`)** — uses `ink` token
- **Secondary text (`#A2A2A9`)** — uses `ink-soft` token
- **Muted (`#A2A2A9`)** — uses `muted` token
- **Borders (`rgba(7, 7, 7, 1)`)** — uses `line` token

## Typography

- **Display:** geometric-sans
- **Body:** humanist-sans

## Layout

Asymmetric grid with full-width hero sections and 2-column project galleries.

*Rhythm:* Loose vertical rhythm with generous padding around primary elements.

## Elevation & Depth

- Borders: No visible borders; relies on spacing and image edges for separation.

## Shapes

- `sm`: 4px
- `md`: 4px
- `lg`: 5px
- `pill`: 999px

## Components

- **button:** Text-only navigation links, uppercase, small scale, no background
- **card:** Full-bleed photography project cards with small uppercase labels
- **hero:** Massive typographic statement on light background with minimal secondary text

## Do's and Don'ts

**Don't:**
- Don't use multiple accent colors — screenshot shows a strict monochrome palette with light gray and black.
- Don't center-align all text — screenshot shows mixed alignments including left-aligned and asymmetric layouts.
- Don't use heavy drop shadows — screenshot shows completely flat surfaces with no depth effects.
- Don't use rounded container corners — screenshot shows sharp edges or very minimal rounding.
- Don't use thick borders to separate sections — screenshot shows separation through white space and image placement.
- Don't use busy decorative patterns — screenshot relies entirely on clean typography and photography.

---

## System Prompt (paste into AI agent)

```
14islands is a premium design agency website characterized by extreme typographic scale, a near-monochromatic palette (bg: #F2F2F2, ink: #070707, muted: #A2A2A9), and generous white space. The design uses geometric and humanist sans-serif fonts at massive scales (up to 180px) with tight negative tracking. Layouts are asymmetric with full-bleed photography project cards. Critical donts: avoid multiple accent colors, avoid centering all text, avoid heavy shadows, avoid thick borders, avoid decorative patterns, and avoid rounded corners on cards.
```