---
name: Basement Studio
description: "This site is worth including as a prime example of a premium, dark-themed creative agency portfolio with a bold, minimalist aesthetic."
version: alpha

colors:
  background: "#000000"
  primary: "#ffffff"
  secondary: "#e6e6e6"
  neutral: "#c4c4c4"
  bg-soft: "#1a1a1a"
  bg-quiet: "#2e2e2e"
  muted-soft: "#757575"
  line: "rgba(230, 230, 230, 0.3)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 76px
    lineHeight: 0.9
    fontWeight: 600
    letterSpacing: "-3.04px"
  h1:
    fontFamily: geometric-sans
    fontSize: 38px
    lineHeight: 1.2
    fontWeight: 600
    letterSpacing: "-1.52px"
  body:
    fontFamily: geometric-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "0px"
  caption:
    fontFamily: geometric-sans
    fontSize: 13px
    lineHeight: 1.2
    fontWeight: 600
    letterSpacing: "-0.4px"

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

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

---

## Overview

A digital studio & branding powerhouse making cool shit.

*A dark, immersive digital workshop or gallery showcasing high-end creative work.*

## Colors

High-contrast monochrome with deep blacks and bright whites, accented only by project imagery.

- **Background (`#000000`)** — uses `bg` token
- **Primary text (`#ffffff`)** — uses `ink` token
- **Secondary text (`#e6e6e6`)** — uses `ink-soft` token
- **Muted (`#c4c4c4`)** — uses `muted` token
- **Borders (`rgba(230, 230, 230, 0.3)`)** — uses `line` token

## Typography

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

## Layout

Full-width hero images followed by grid-based project showcases with large titles and descriptions.

*Rhythm:* Grid-based layout with generous padding and gutters, typically 16px or 24px.

## Elevation & Depth

- Borders: Subtle horizontal dividers using rgba(230, 230, 230, 0.3) at 1px width.

## Shapes

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

## Components

- **button:** Text-based navigation links with bold weight, no visible backgrounds or borders.
- **card:** Project entries featuring large imagery alongside descriptive text, separated by thin lines.
- **chip:** None observed.
- **input:** None observed.
- **hero:** Immersive full-width image or video background with overlaid text and a 'Scroll to Explore' prompt.

## Do's and Don'ts

**Don't:**
- Don't use serif fonts — screenshot shows geometric sans-serif for all text.
- Don't add background colors to buttons — screenshot shows text-only navigation links.
- Don't use heavy drop shadows — screenshot shows completely flat surfaces.
- Don't use rounded corners on cards or containers — screenshot shows sharp, square edges.
- Don't use multiple accent colors — screenshot shows a strictly monochrome palette with project imagery providing color.
- Don't clutter the layout with borders — screenshot shows minimal horizontal dividers.

---

## System Prompt (paste into AI agent)

```
Basement Studio is a high-end creative agency specializing in digital experiences and branding. The design DNA is defined by a deep black (#000000) background and pure white (#ffffff) ink, creating a stark, high-contrast canvas. Typography utilizes geometric sans-serif (Geist) and monospace (Geist Mono) categories. The layout is spacious and grid-based, prioritizing bold headlines and immersive project imagery. Critical don'ts: never add background colors to buttons, never use rounded corners on containers, and never introduce multiple accent colors into the core interface.
```