Design Philosophy Inventory
The full style inventory, grouped into broad buckets instead of fake micro-families.
This is the canonical inventory of the microsite styles explored so far: what family each belongs to, how the colors behave, how the grid thinks, what kind of reading mode it creates, and what the type system is supposed to do culturally, not just cosmetically.
Taxonomy correction: rave flyer, venue board, and nearby event variants are now treated as one larger event/nightlife cluster. Broadcast descendants are treated as a branch inside the larger Y2K screen-culture bucket, not their own top-level family.
Canonical top-level buckets
Systems modernism
The rigorous, institutional surfaces: less mood, more order, governance, and typographic authority.
SwissIBM Systems Manual
Premium product surfaces
Polished software and fintech presentation systems built around confidence, clarity, and product theater.
Stripe Fintech EditorialFramer Dark Motion Tool
Printed/editorial artifacts
Pages treated like posters, photocopies, handouts, or circulated design objects instead of neutral websites.
Art School PosterZine Xerox BulletinXerox Punk Bulletin
Catalog and archive intelligence
Dense, humane, browse-first structures for collected knowledge, recommendation logic, and field-guide reading.
Whole Earth CatalogWhole Earth Catalog 1977
Y2K screen cultures
The broad digital-era branch: machine shells, portals, creator worlds, countdown boards, kiosks, and broadcast descendants.
Y2K Cyber FutureIndustrial Flash ChassisBroadcast Candy PortalIndie Cyber-Pop PortalBroadcast Candy ExtremeSatellite Pop CountdownMall Future KioskPublic Access Rave Guide
Event and nightlife graphics
Rave flyers, venue boards, and event-driven information surfaces. These are modes inside one cluster, not separate families.
Rave Flyer NightmareDNA Lounge Rave BoardDNA Candy Collision
Original labRational / institutional
Swiss
Editorial rigor over mood; structure does the styling.
- Fonts
- IBM Plex Sans + IBM Plex Mono
- Font philosophy
- Neutral grotesk plus technical mono. Typography should feel measured, infrastructural, and accountable rather than expressive.
- Colors
- Restrained neutrals with a forceful signal red accent.
- Grid philosophy
- Strict modular grid with asymmetry controlled by rules and alignment.
- Layout behavior
- Large thesis header, disciplined sections, metadata rails, minimal ornament.
- Reading mode
- Field report / systems essay.
Open style ↗
Original labY2K proto-branch
Y2K Cyber Future
Effect-driven futurism rather than rigorous editorial structure.
- Fonts
- Orbitron + Inter
- Font philosophy
- A synthetic display face paired with a contemporary utility sans. Headline says future-device; body keeps the page legible.
- Colors
- Dark navy-black base with icy cyan glow and chrome-adjacent luminosity.
- Grid philosophy
- Panel logic more than poster logic; modules read as glowing surfaces.
- Layout behavior
- Hero panels, glossy containers, atmospheric depth, light-on-dark interface theater.
- Reading mode
- Future portal / spectacle surface.
Open style ↗
Original labPrinted artifact / anti-clean
Art School Poster
Treats type as composition, not just hierarchy.
- Fonts
- Space Grotesk + Source Serif 4
- Font philosophy
- Sharp contemporary sans for structure, serious serif for argument and cultural weight. The pairing should feel crit-room, not corporate.
- Colors
- Warm paper, black ink, sharp orange-red intervention.
- Grid philosophy
- Poster grid with dramatic scale changes and compositional tension.
- Layout behavior
- Typographic blocks, exhibition framing, composition-led sectioning.
- Reading mode
- Design critique / cultural poster.
Open style ↗
Original labPrinted artifact / anti-clean
Zine Xerox Bulletin
Artifact texture and marginality matter as much as content hierarchy.
- Fonts
- Special Elite + Inter
- Font philosophy
- Typewriter distress for headers and annotations, clean sans underneath so the mess stays readable.
- Colors
- Photocopy paper tones, black, off-white, yellow highlight.
- Grid philosophy
- Loose split-column bulletin logic with interruptions and rough dividers.
- Layout behavior
- Dashed rules, pasted notes, copied-sheet atmosphere.
- Reading mode
- Circulated handout / scene bulletin.
Open style ↗
Original labWhole Earth / catalog intelligence
Whole Earth Catalog
Collected-human intelligence instead of polished brand staging.
- Fonts
- Newsreader + IBM Plex Sans + IBM Plex Mono
- Font philosophy
- Readable editorial serif for the big intelligence layer, practical sans for labels, mono for taxonomy and evidence trails.
- Colors
- Earth paper, olive green, brown utility ink.
- Grid philosophy
- Dense catalog grid with sidebar logic and practical taxonomy.
- Layout behavior
- Annotated lists, recommendation panels, side notes, warm abundance.
- Reading mode
- Field guide / practical catalog.
Open style ↗
V2Rational / institutional
IBM Systems Manual
Less editorial than Swiss; more procedural and governed.
- Fonts
- IBM Plex Sans + IBM Plex Mono
- Font philosophy
- Exacting sans and mono with zero whimsy. The type should imply procedural review, definitional clarity, and enterprise trust.
- Colors
- White, gray, black, IBM blue.
- Grid philosophy
- Rectilinear spec-sheet grid with explicit boundaries.
- Layout behavior
- Labeled blocks, process zones, manual-like segmentation.
- Reading mode
- Systems manual / technical explainer.
Open style ↗
V2Premium software / polished tech
Stripe Fintech Editorial
Financial calm and polish instead of procedural severity.
- Fonts
- Source Sans 3 + Source Code Pro
- Font philosophy
- Humanist sans for premium clarity; restrained mono for evidence, metrics, and technical credibility.
- Colors
- White and pale blue-gray with deep navy and premium purple.
- Grid philosophy
- Soft modular editorial grid with generous spacing.
- Layout behavior
- Airy metrics, investor-caliber sections, polished report cards.
- Reading mode
- Premium strategic briefing.
Open style ↗
V2Premium software / polished tech
Framer Dark Motion Tool
Most explicitly software-performative of the set.
- Fonts
- Inter + Azeret Mono
- Font philosophy
- Neutral software sans for the interface body; crisp mono for instrument-readout credibility. Typography should feel demo-ready and productized.
- Colors
- Void black, soft gray, white, electric blue.
- Grid philosophy
- Software-stage grid with demo-screen emphasis.
- Layout behavior
- Hero screens, rings, dark theater, staged product-surface modules.
- Reading mode
- Tool demo / motion product reveal.
Open style ↗
V2Printed artifact / anti-clean
Xerox Punk Bulletin
More agitated and materially specific than the first zine pass.
- Fonts
- Special Elite + Inter
- Font philosophy
- Distressed typewriter display for authenticity, modern sans for all the stuff a user must actually read.
- Colors
- Dirty paper, black toner, rough white.
- Grid philosophy
- Broken-sheet bulletin grid with taped interruptions.
- Layout behavior
- Stamps, tape, copied-sheet blocks, marginal commentary.
- Reading mode
- Flyer / hand-copied punk memo.
Open style ↗
V3Rave / nightlife
Rave Flyer Nightmare
Highest color aggression; readability intentionally pushed.
- Fonts
- Inter
- Font philosophy
- One blunt contemporary sans used aggressively. The philosophy is scale violence and collision rather than nuanced pairing.
- Colors
- Acid yellow, hot orange, magenta, cyan, black.
- Grid philosophy
- Poster-blast grid with impact blocks over reading comfort.
- Layout behavior
- Event hierarchy, fluorescent blocks, urgency-first composition.
- Reading mode
- Warehouse flyer / wall scream.
Open style ↗
V3Rave / nightlife
DNA Lounge Rave Board
Utility first; far less posterized than the rave flyer page.
- Fonts
- Arial / Helvetica system sans
- Font philosophy
- Default-looking utilitarian sans to preserve venue-site authenticity. The font should feel used, not art-directed.
- Colors
- Black, white, orange-red, gray utility tones.
- Grid philosophy
- Event-board split layout with utility density.
- Layout behavior
- Calendar-ish columns, venue facts, dense navigation, operational boxes.
- Reading mode
- Actual club website / event board.
Open style ↗
V3Whole Earth / catalog intelligence
Whole Earth Catalog 1977
The strongest archival catalog silhouette in the inventory.
- Fonts
- IBM Plex Sans + Special Elite
- Font philosophy
- Practical sans for organization plus typewriter-style accent for catalog artifact tone. The goal is human assembly, not cleanliness.
- Colors
- Tan paper, brown ink, muted ochre and catalog warmth.
- Grid philosophy
- Tri-column catalog/index logic.
- Layout behavior
- Panels, listings, recommendation index, sidebars, dense navigation.
- Reading mode
- Countercultural catalog / browse-and-compare guide.
Open style ↗
V4Y2K branches
Industrial Flash Chassis
Most mechanical and chassis-like Y2K branch.
- Fonts
- Inter
- Font philosophy
- A clean neutral sans treated like embedded interface text. The philosophy is machine-shell framing, not expressive typography.
- Colors
- Blue-black steel, cold interface blues, pale machine text.
- Grid philosophy
- Device-shell split grid with dashboard sensibility.
- Layout behavior
- Viewport shell, framed panels, scanline/device cues, mechanical zoning.
- Reading mode
- Media machine / interface object.
Open style ↗
V4Y2K branches
Broadcast Candy Portal
Most cheerful and broadcast-social of the Y2K branches.
- Fonts
- Inter
- Font philosophy
- Neutral sans carrying exaggerated casing, bubbles, and promo energy. The shape language does the nostalgia more than the typeface itself.
- Colors
- Cream and yellow, cyan, orange, green, navy.
- Grid philosophy
- Portal-style multi-zone grid with side rails and promo blocks.
- Layout behavior
- Three-zone candy-channel layout, cluttered promos, playful blocks.
- Reading mode
- TV portal / media homepage.
Open style ↗
V4Y2K branches
Indie Cyber-Pop Portal
Most intimate and self-authored Y2K branch.
- Fonts
- Inter
- Font philosophy
- Contemporary sans repurposed toward creator-coded weirdness. The voice comes from personal collage behavior and text treatment more than family contrast.
- Colors
- Orange, pink, dark purple, warm pop neon.
- Grid philosophy
- Looser collage-like structure with less institutional alignment.
- Layout behavior
- Personal-world portal, softer frame, creator-space energy.
- Reading mode
- Weird personal internet world.
Open style ↗
V5Broadcast descendants
Broadcast Candy Extreme
Most ballooned and mascot-like of V5.
- Fonts
- Bungee + Nunito Sans
- Font philosophy
- Inflated cartoon-display type with a rounded friendly sans. This pairing should feel like toy-channel branding and promo overload.
- Colors
- Cream, bright yellow, cyan, vivid mid-blue, navy.
- Grid philosophy
- Portal grid with promo overload.
- Layout behavior
- Stacked feature well, candy chips, loud blocks, headline-first modules.
- Reading mode
- Everything-is-featured TV portal.
Open style ↗
V5Broadcast descendants
DNA Candy Collision
Most nightlife-compressed typographically in V5.
- Fonts
- Bebas Neue + Barlow Condensed
- Font philosophy
- Compressed flyer display plus dense condensed support text. The type should feel poster-stripped, loud, and urban-nightlife rather than toy-like.
- Colors
- Black-purple nightlife base with acid lime and pale violet text.
- Grid philosophy
- Currently portal-based, but semantically pushed toward venue strip density.
- Layout behavior
- Ticket-strip energy, event pressure, black-neon media shell.
- Reading mode
- Club flyer inside a portal wrapper.
Open style ↗
V5Broadcast descendants
Satellite Pop Countdown
Most scoreboard-oriented V5 branch.
- Fonts
- Orbitron + Space Grotesk
- Font philosophy
- Synthetic techno display with a crisp geometric sans underneath. The pairing should feel ranked, networked, and lightly futuristic.
- Colors
- Pale cyan, light blue, orange accent, deep broadcast blue.
- Grid philosophy
- Currently portal-based, intended toward rankings and countdown widgets.
- Layout behavior
- Countdown blocks, scoreboards, orbital widgets, media-network optimism.
- Reading mode
- Chart show / countdown special.
Open style ↗
V5Broadcast descendants
Mall Future Kiosk
Most commercial and mall-coded of V5.
- Fonts
- Audiowide + Varela Round
- Font philosophy
- Friendly sci-fi display with soft rounded body text. Typography should feel kiosk-promotional, mall-retail, and excited to sell tomorrow.
- Colors
- White-lilac, pink, cyan, glossy purple-dark support tones.
- Grid philosophy
- Currently portal-based, rhetorically aimed at kiosk promos and retail tiles.
- Layout behavior
- Coupon bursts, nav pills, gift-guide energy, glossy promo surfaces.
- Reading mode
- Teen-tech retail portal.
Open style ↗
V5Broadcast descendants
Public Access Rave Guide
Most civic and informationally scrappy of V5.
- Fonts
- Oswald + IBM Plex Sans
- Font philosophy
- Narrow urgent display with sober informational sans. The type should feel like PSA bars meeting community listings and low-budget local broadcast.
- Colors
- Pale lime, yellow, orange, cyan, civic dark navy-charcoal.
- Grid philosophy
- Currently portal-based, semantically bent toward alert bars and listings.
- Layout behavior
- PSA-strip rhetoric, local calendar energy, anti-clean civic weirdness.
- Reading mode
- Community bulletin / public-access mutant.
Open style ↗