Basement Studio

Dark, immersive, and unapologetically confident. A gritty 3D virtual clubhouse gives way to brutalist typographic precision, using ultra-tight line-heights and stark monochrome contrast punctuated only by rare neon orange indicators.

mysterious rebellious luxurious serene

Visit site

Rated

8.4/ 10

From 6 analysed sections. Two measured components and one judged by a model. Distinction is a rank within the library; the rest are scores in their own right.

AI scorejudged: 9.9
Systemmeasured: 7.3
Distinctionmeasured: 7.1

on the grid: 70%
vertical rhythm: 95%
type on a scale: 43%
contrast passing AA: 83%
unlike the library: 0.99
model craft: 8.2/10
model deviation: 5.7/10

Colour

Background#000000

Text#e6e6e6

Accent#ff4d00

Surface#1a1a1a

Muted#757575

Typefaces

Display: Geist
Body: Geist
Mono: Geist Mono
Source: self_hosted
Scale: 12 · 13 · 20 · 24 · 38 · 76

Layout

Grid: 24 columns
Container: 1408px
Spacing base: 4px
Radius: 0px · 4px

Capture

Category: studio
Sections: 6
Captured: 2026-09-02
Rhythm: dark x7

Type rules

display headlines tightly tracked at -0.04em with leading under 1.0
body text restricted to a narrow 35-character measure for fast readability

Colour rules

background remains absolute pitch black (#000000) across all viewports
neon safety orange (#ff4d00) is reserved solely for live status badges and interaction highlights

Voice rules

use colloquial studio swagger in major headings
keep project descriptions focused on velocity and high-impact metrics

Holds it together

maintain an unbroken pure black canvas without alternating background panels
organize partner logos within a multi-row grid bounded by hairline borders
anchor the lower viewport with an oversized, ultra-wide studio brand mark

Contrast

text on background16.8:1 AAA

muted text on background4.6:1 AA

text on surface13.9:1 AAA

muted text on surface3.8:1 AA Large

accent on background6.3:1 AA

background on accent6.3:1 AA

Type, measured

Body: 20px / 1
Measure: 35 characters
Display: 87px / 0.9
Tracking: -0.04em display
Scale ratio: 1.44

Voice

Tone: confident, irreverent, direct
Sentences: short
Person: first
Vocabulary: informal
Calls to action: roll, contact, send

Built with

Builder: —
Framework: next
Motion: —
WebGL: yes
Nav: sticky_top_bar, 6 items, sticky
Length: 7.5 screens

Sections in page order

Rhythm — each block is a section, as wide as it is tall, in the colour it is on

00
hero
Strong
An immersive, dimly lit 3D interactive virtual office space that feels mysterious and game-like.
Mood
mysterious + playful
Layout
24 col · full bleed · airy
Open section
01
hero
An unapologetic, high-contrast dark hero pairing an assertive statement headline with an expansive hairline matrix of high-profile client logos.
Mood
rebellious + clinical
Layout
12 col · stacked · dense
Open section
02
showcase
Monochrome, high-precision portfolio grid balancing stark black negative space against bold project previews and structured editorial metadata.
Mood
luxurious + serene
Layout
12 col · grid · balanced
Open section
03
feature grid
Stark, high-contrast dark capabilities section anchored by an oversized declarative statement and a clean four-column typographic grid.
Mood
luxurious
Layout
4 col · stacked · balanced
Open section
04
cta
Strong
Stark black contact section dominated by punchy, tight-set typography and an enormous brutalist studio wordmark anchoring the base.
Mood
rebellious + gritty
Layout
24 col · stacked · airy
Open section
05
footer
Strong
A pitch-black minimalist footer framed by vast negative space, anchoring an oversized typographic site index beside a muted newsletter signup.
Mood
serene
Layout
24 col · asymmetric · airy
Open section