Design system · v0.1

PitchArena design system.

The shared foundation for the arena product surface — principles, palette, type, components, and language.

/ 01

Brand principles

Principle 01

Arena-based training

We don't teach communication. We make people train it through challenges.

Principle 02

Performance under pressure

Constraints — time, objectives, AI reactions — turn talking into practice.

Principle 03

Objectives and scoring

Every round has visible goals and a verdict. No vague feedback.

/ 02

Colors

Warm, dark surface palette with three accent grades for arena states.

#070707
Ink 0
page
#111111
Ink 1
background
#181818
Ink 2
surface
#2A2622
Walnut
warm surface
#706B64
Stone 600
muted
#A8A29A
Stone 400
secondary text
#F5F2EA
Bone
primary text
#F59E0B
Amber
interview arena
#F97316
Orange
explain arena
#EF4444
Crimson
persuasion arena
/ 03

Typography

Geist for UI and display, JetBrains Mono for labels and meta.

Hero
Build confidence.
Section title
Every round has objectives.
Card title
Handle a difficult recruiter question
Body
Each round has a clear context, three visible objectives, and a strict time limit.
Muted
Choose your arena. Start a challenge.
Mono / meta
challenge · 1 / 3
/ 04

Components

The core building blocks of the arena product surface.

Challenge card
Interview Arena Premium

Defend a past decision

2mHard
Objective checklist
  • Open with the headline answerachieved
  • Back it with one concrete exampleachieved
  • ~Address the underlying objectionpartial
  • Close with a clear next stepmissed
Score card
Clarity
82 / 100
Concise phrasing
Badges
InterviewExplainPersuasionSupportPremiumComing soonLocked
Buttons
/ 05

Spacing

Tailwind scale used across the product. Multiples of 4px.

1 · 4px
2 · 8px
3 · 12px
4 · 16px
6 · 24px
8 · 32px
12 · 48px
16 · 64px
/ 06

Terminology

Speak the same language across UI, marketing, and docs.

Arena
A category of communication scenarios (Interview, Explain, Persuasion, Support).
Challenge
A single training scenario with context, objectives, and a time limit.
Round
A live attempt at a challenge — speak under constraints, get scored.
Objectives
The three or four visible goals that define what a strong round looks like.
Score
Numeric performance verdict across Clarity, Structure, Relevance, Presence.
Unlock
Granting access to harder rounds or premium challenges.