---
name: Co Projects
description: "This site is worth including as an example of brutalist/minimalist web design that uses geometric forms as the primary visual language rather than traditional UI components."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#000000"
  line: "rgba(229, 231, 235, 1.0)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 60px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "0px"
  body:
    fontFamily: geometric-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "0px"

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

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

---

## Overview

A minimalist, high-contrast portfolio site dominated by massive geometric forms.

*A stark architectural model or a bold graphic print.*

## Colors

Strict binary palette: pure black (#000000) on pure white (#FFFFFF).

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#000000`)** — uses `ink` token
- **Borders (`rgba(229, 231, 235, 1.0)`)** — uses `line` token

## Typography

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

- Use 'Alpha' font family for primary display and body text
- Use 'Takt' font family for monospace elements
- Maintain consistent font-weight of 400 across all text elements

## Layout

Asymmetric split layout with massive geometric shapes on left and right, minimal navigation at top

*Rhythm:* Generous whitespace with large vertical gaps between major elements

## Elevation & Depth

- Borders: Thin 1px borders using rgb(229, 231, 235) for subtle separation

## Shapes

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

## Components

- **button:** Text-only navigation links with pointer cursor
- **card:** No traditional cards; content presented as large geometric compositions
- **chip:** Not present in the visible design
- **input:** Not present in the visible design
- **hero:** Dominant geometric circle/semicircle compositions with minimal text

## Do's and Don'ts

**Don't:**
- Don't add rounded corners — screenshot shows sharp, geometric edges on all shapes
- Don't introduce color variations — screenshot shows strictly black (#000000) and white (#FFFFFF)
- Don't use multiple font weights — screenshot shows consistent weight 400 throughout
- Don't add drop shadows — screenshot shows flat, 2D compositions without depth effects
- Don't create complex navigation menus — screenshot shows minimal text links at top
- Don't add decorative illustrations — screenshot uses only abstract geometric forms
- Don't use gradient backgrounds — screenshot shows solid white (#FFFFFF) background

---

## System Prompt (paste into AI agent)

```
Co Projects is a minimalist, experimental portfolio site using a stark black-and-white palette with massive geometric circle and semicircle compositions as the primary visual language. The design features pure white (#FFFFFF) background with solid black (#000000) geometric shapes and minimal navigation text. Typography uses the 'Alpha' font family in a geometric sans-serif category at weight 400, with 60px display size and 16px body text. The layout is asymmetric with generous whitespace and large vertical gaps. Key characteristics include: no color variations, no rounded corners, no shadows, no gradients, and minimal text content. Navigation consists of simple text links ('Co Projects', 'Builder', 'About') with pointer cursors. All transitions apply to all properties. The site avoids decorative elements, complex navigation, and text-heavy introductions, focusing instead on bold geometric forms as visual focal points.
```