// Step 01 — Start Here

Select your style.

Our styles bring your content to life. Choose your path. Select Category or Free Combination to get started. Email the results when finished.

ACTIVE
⚡ Fast
Category Selection
Pick your niche — Author, Podcaster, Educator, or Content Creator. Get curated style packs built for your world. Done in 2 clicks.
ACTIVE
⊞ Advanced
Free Combination
Mix and match any color with any typeface independently. Full access to all 20 colors, 20 type pairings, and 10 wildcards.
// Fast Path — Step 01
What best describes you?

Select your category and we'll show you curated style packs designed specifically for your type of content and audience.

📖
Author
Books, courses, written IP
🎙️
Podcaster
Audio content, show tools
🎓
Educator
Curriculum, classroom tools
📱
Content Creator
Social, video, brand tools
// Author — Curated Packs
Your Style Options

Five packs built for authors. Each combines a color mode, typography, and feel — click one to select it.

✓ Selected
archive + t2
Mode: Archive + T2
The Antiquarian
Sepia warmth · Playfair Display · Premium analog feel
✓ Selected
ink + t7
Mode: Ink + T7
The Classicist
Cream white · Libre Baskerville · Timeless authority
✓ Selected
marque + t14 + w5
Mode: Marque + T14 + W5
The Prestige
Gold champagne · Cormorant Garamond · Dark grain texture
✓ Selected
blueprint + t2 + w10
Mode: Blueprint + T2 + W10
The Editorial
Clean white · Playfair Display · Magazine spread layout
✓ Selected
foundry + t5
Mode: Foundry + T5
The Authority
Gold on dark · Archivo Black · High-ticket book tool
// Podcaster — Curated Packs
Your Style Options

Five packs built for podcasters and audio-first brands.

✓ Selected
dusk + t9
Mode: Dusk + T9
The Narrative
Cinematic purple · Lora/Open Sans · Moody storytelling
✓ Selected
transmission + t8 + w7
Mode: Transmission + T8 + W7
The Signal
Deep space purple · Syne headers · Aurora gradient
✓ Selected
dispatch + t7
Mode: Dispatch + T7
The Correspondent
Amber urgency · Libre Baskerville · Field report energy
✓ Selected
scaffold + t13
Mode: Scaffold + T13
The Studio
Raw black · Barlow Condensed · No-nonsense production feel
✓ Selected
archive + t18 + w5
Mode: Archive + T18 + W5
The Vault
Sepia depth · Merriweather · Timeless long-form companion
// Educator — Curated Packs
Your Style Options

Five packs built for educators, teachers, and course creators.

✓ Selected
campus + t4
Mode: Campus + T4
The Academy
Academic blue · Fraunces/Public Sans · Trusted and structured
✓ Selected
blueprint + t7 + w8
Mode: Blueprint + T7 + W8
The Curriculum
Editorial white · Libre Baskerville · Ruled paper texture
✓ Selected
meridian + t6
Mode: Meridian + T6
The Platform
Clean SaaS blue · Outfit · Modern course platform feel
✓ Selected
flora + t4 + w4
Mode: Flora + T4 + W4
The Workshop
Organic green · Fraunces · Soft extruded surfaces
✓ Selected
slate + t18
Mode: Slate + T18
The Institute
Corporate blue · Merriweather · Professional institution weight
// Content Creator — Curated Packs
Your Style Options

Five packs built for content creators, social-first brands, and digital products.

✓ Selected
tide + t6
Mode: Tide + T6
The Feed
Coastal cyan · Outfit · Clean aspirational creator SaaS
✓ Selected
ember + t12
Mode: Ember + T12
The Brand
Warm orange · DM Serif Display · Founder voice energy
✓ Selected
scaffold + t5 + w2
Mode: Scaffold + T5 + W2
The Disrupt
Red on black · Archivo Black · Neo-brutalist impact
✓ Selected
transmission + t17 + w7
Mode: Transmission + T17 + W7
The Drop
Deep space · Unbounded headers · Aurora mesh background
✓ Selected
switchboard + t1 + w3
Mode: Switchboard + T1 + W3
The Dashboard
Pure black · Space Grotesk · Bento grid layout
// Step 02 — Color Mode
Choose Your Color System

This sets the entire palette — background, surface, text, accent, and border tokens. Every mode ships with both a dark and light state.

👆
Click any card to select it. Click again to deselect. Use the dark/light toggle in the header to compare modes in both states. Once you make a selection, the page scrolls to the next step automatically.
✓ Selected
Go
switchboard
01
Switchboard
Technical · Brutalist · High-Utility
Dark Default
✓ Selected
Go
blueprint
02
Blueprint
Editorial · Spacious · Trustworthy
Light Default
✓ Selected
Go
foundry
03
Foundry
Industrial · Machined · High-Ticket
Dark Default
✓ Selected
Go
campus
04
Campus
Structured · Academic · Reliable
Light Default
✓ Selected
Read →
ink
05
Ink
Minimalist · Classic · Timeless
Light Default
✓ Selected
CONNECT_
signal
06
Signal
High-Alert · Data-Terminal · Command-Center
Dark Default
✓ Selected
Go
dispatch
07
Dispatch
Newsroom Urgency · Amber · Field Report
Dark Default
✓ Selected
Subscribe
transmission
08
Transmission
Deep Space · Broadcast · Cult Creator
Dark Default
✓ Selected
BUILD_IT
scaffold
09
Scaffold
Concrete · Raw Material · Utility-Grade
Dark Default
✓ Selected
Open Archive
archive
10
Archive
Sepia Intelligence · Aged Paper · Analog Vault
Dark Default
✓ Selected
Get Started
meridian
11
Meridian
Clean · Modern · Conversion-Optimized SaaS
Light Default
✓ Selected
Take Action
ember
12
Ember
Warm · Motivational · High-Energy Brand
Light Default
✓ Selected
Schedule Call
slate
13
Slate
Corporate · Boardroom-Ready · Zero Decoration
Light Default
✓ Selected
Begin
flora
14
Flora
Organic · Calm · Restorative
Light Default
✓ Selected
SECURE ACCESS
vault
15
Vault
Precision · Security · Institutional Trust
Dark Default
✓ Selected
DISCOVER
marque
16
Marque
Champagne · Restraint · Old-Money Aesthetics
Light Default
✓ Selected
FILE NOW
crimson
17
Crimson
Bold · Declarative · High-Stakes
Dark Default
✓ Selected
Listen Now
dusk
18
Dusk
Cinematic · Moody · Narrative-Driven
Dark Default
✓ Selected
COMPILE ›
circuit
19
Circuit
PCB-Green · Hardware Precision · Dev Tools
Dark Default
✓ Selected
Start Creating
tide
20
Tide
Coastal Calm · Aspirational · Creator Economy
Light Default
// Step 03 — Typography
Choose Your Type Pairing

Each card renders in the actual fonts — what you see is exactly how your tool's headings and body text will look. T1–T10 use sharp corners. T11–T20 use refined corners.

🔤
Pick the pairing that matches your brand voice. The heading font sets the tone. The body font handles readability. Selecting a card scrolls you to the next step.
✓ Selected
T1
The Monolith
Modern, tech-heavy. The default for high-velocity digital products.
HeadingSpace Grotesk 700
BodyInter 400
Radius0px — Sharp
✓ Selected
T2
The Curator
High-end author and premium editorial. Sharp serif vs. clean body.
HeadingPlayfair Display 700
BodySource Sans Pro 400
Radius0px — Sharp
✓ Selected
T3
The Terminal
Pure developer. Everything monospace. Under-the-hood utility energy.
HeadingJetBrains Mono 700
BodyJetBrains Mono 400
Radius0px — Sharp
✓ Selected
T4
The Scholar
Soft-academic, trusted education. Fraunces warmth + Public Sans neutrality.
HeadingFraunces 700
BodyPublic Sans 400
Radius0px — Sharp
✓ Selected
T5
The Swiss
Bold, aggressive marketing. Archivo Black headlines demand attention.
HeadingArchivo Black
BodyArchivo 400
Radius0px — Sharp
✓ Selected
T6
The Minimalist
Ultra-clean, geometric. One family, two weights. Pure SaaS energy.
HeadingOutfit 700
BodyOutfit 400
Radius8px — Refined
✓ Selected
T7
The Journalist
Traditional authority meets digital newsroom. Classic weight, modern body.
HeadingLibre Baskerville 700
BodyMontserrat 400
Radius0px — Sharp
✓ Selected
T8
The Specialist
Creative, avant-garde, high-taste IP. Syne is characterful; Work Sans grounds it.
HeadingSyne 700
BodyWork Sans 400
Radius0px — Sharp
✓ Selected
T9
The Executive
Professional, balanced, universally legible. Safe-bet for any business tool.
HeadingLora 700
BodyOpen Sans 400
Radius0px — Sharp
✓ Selected
T10
The Kinetic
High-energy, sports, performance. Bebas is all-caps impact; Roboto is solid utility.
HeadingBebas Neue
BodyRoboto 400
Radius0px — Sharp
✓ Selected
T11
The Operator
Systems thinking, technical docs, fintech. IBM Plex is engineered for precision.
HeadingIBM Plex Mono 700
BodyIBM Plex Sans 400
Radius8px — Refined
✓ Selected
T12
The Orator
Confident, speech-like. Built for founder voices and personal brand tools.
HeadingDM Serif Display
BodyDM Sans 400
Radius8px — Refined
✓ Selected
T13
The Dispatch
Compact urgency. Built for newsletters, field reporting, high-density info.
HeadingBarlow Condensed 700
BodyBarlow 400
Radius8px — Refined
✓ Selected
T14
The Naturalist
Organic elegance. Cormorant is refined and literary; Nunito Sans is friendly.
HeadingCormorant Garamond 700
BodyNunito Sans 400
Radius8px — Refined
✓ Selected
T15
The Disruptor
Startup energy. Unbounded is geometric and wide — reads like a statement.
HeadingUnbounded 700
BodyDM Sans 400
Radius8px — Refined
✓ Selected
T16
The Slab
Heavy authority. Institutional weight for legal, compliance, high-trust content.
HeadingRoboto Slab 700
BodyRoboto 400
Radius8px — Refined
✓ Selected
T17
The Drifter
Web3, generative, boundary-pushing digital. Feels like it belongs on a protocol.
HeadingUnbounded 700
BodyDM Sans 400
Radius8px — Refined
✓ Selected
T18
The Anchor
Long-form readability. Merriweather optimized for screen reading; Inter pairs cleanly.
HeadingMerriweather 700
BodyInter 400
Radius8px — Refined
✓ Selected
T19
The Craft
High-taste independent brand. Josefin Sans geometric elegance; Mulish is quiet.
HeadingJosefin Sans 700
BodyMulish 400
Radius8px — Refined
✓ Selected
T20
The Signal
Data dashboards and metrics tools. Space Mono headers read like output.
HeadingSpace Mono 700
BodyInter 400
Radius8px — Refined
// Step 04 — Wildcard OPTIONAL
Add a Surface Treatment

Wildcards are overlay effects applied on top of your color and type choices. They change how surfaces behave — not the palette or the fonts.

⚡
This step is optional. Skip it if you want a clean, standard layout. Wildcards can always be refined later in the build process. Selecting one scrolls you to the final step.
✓ Selected
W1
Glassmorphism
Frosted glass surfaces. Depth through blur, not shadow. Multi-plane layered layouts.
backdrop-filter: blur(12px)
Best with: Transmission, Meridian, Tide, Vault
✓ Selected
W2
Neo-Brutalism
Raw, confrontational. Offset drop shadows, thick borders, flat color blocks. No radius.
box-shadow: 4px 4px 0px
Best with: Switchboard, Scaffold, Dispatch, Crimson
✓ Selected
W3
Bento Grid
Information-dense card layout. Everything in defined cells. Mixed col sizes for hierarchy.
Best with: Meridian, Blueprint, Slate, Foundry
✓ Selected
W4
Neumorphism
Extruded surfaces via dual box-shadow. Elements appear pressed in or raised out. Use sparingly.
dual box-shadow extrusion
Best with: Flora, Campus, Ink, Blueprint
✓ Selected
W5
Dark Grain
Film-noir texture. SVG noise overlay at 4% opacity — felt more than seen. Analog meets digital.
Best with: Archive, Foundry, Dusk, Ink
✓ Selected
W6
Terminal Scan
CRT scanlines and phosphor glow. Retro-tech command-line aesthetic with cursor blink.
SYSTEM_READY_
Best with: Signal, Circuit, Switchboard, Dispatch
✓ Selected
W7
Aurora
Gradient mesh backgrounds. Ambient color bleed with subtle animation. Generative-art feel.
Best with: Transmission, Dusk, Tide, Meridian
✓ Selected
W8
Ruled Paper
Notebook lines behind content. Academic, hand-crafted. Line height synced to 28px grid.
Best with: Campus, Ink, Archive, Flora
✓ Selected
W9
Data Density
Maximum information per pixel. 12px base, 4px padding, borders on all grid lines. Bloomberg logic.
SYM
+2.4%
VOL
1.2M
BID
142.3
ASK
142.5
Best with: Vault, Circuit, Signal, Foundry
✓ Selected
W10
Editorial Spread
Magazine layout logic. Drop caps, pull quotes, asymmetric columns. Typography as visual design.
The book became a tool —
not a static object, but an active system.
Pull quote
Best with: Blueprint, Ink, Marque, Dusk
// Step 05 — Submit
Send Your Selections

When you're happy with your choices, click Review & Send. A preview of exactly what gets emailed will appear before anything is sent.

📬
Your selections are saved in this browser. Come back any time and they'll still be here. The email opens pre-filled with your complete style brief in markdown — ready to send directly to Jason.
✓ Copied to clipboard