F1 The Data

Brand identity and design system reference

Logo

Favicon — 32x32 SVG
F1 THE DATAWordmark — Dark background
F1 THE DATAWordmark — Light background

Colors

Brand

F1 Red--f1-red
Logo accent, CTAs, focus ring, flags
Glass--glass-bg
Toolbars and selection controls

Background

Base--bg-base
Page background
Surface--bg-surface
Card / panel background
Elevated--bg-elevated
Raised panels, modals
Hover--bg-hover
Interactive hover state

Text

Primary--text-primary
Headings, primary content
Secondary--text-secondary
Body text, labels
Muted--text-muted
Help text, timestamps
Faint--text-faint
Inactive nav, placeholder
Ghost--text-ghost
Disabled, decorative

Border

Subtle--border-subtle
Dividers, separators
Default--border-default
Card borders
Strong--border-strong
Active borders, focus

Podium

Gold--podium-gold
P1
Silver--podium-silver
P2
Bronze--podium-bronze
P3

Telemetry

Speed#00D4FF
Speed traces, cyan accent
Throttle#39B54A
Throttle traces, DRS
Brake#E10600
Brake traces
Gear#FFD800
Gear indicator, amber

Tyre Compounds

Soft#E10600
Soft compound
Medium#FFD800
Medium compound
Hard#FFFFFF
Hard compound
Intermediate#39B54A
Intermediate compound
Wet#0067FF
Wet compound

Typography

System sans / Inter DisplayDisplay / Headings

System sans-serif with Inter fallback for page titles and section headings.

F1 THE DATA
400 Regular500 Medium700 Bold
System sans / InterBody / UI

Clean, technical sans-serif for body text, labels, and UI elements.

Sector 1: 28.432s — Personal Best
400 Regular500 Medium700 Bold
JetBrains MonoData / Mono

Monospace for timing data, telemetry values, and tabular numbers.

+0.347s LAP 42/57 S:312km/h
400 Regular600 Bold700 Bold

Type Scale

Hero32F1 The Data
H132Australian Grand Prix
H218Championship standings
H314Sector Times
Body14Max Verstappen set the fastest lap on Lap 42 with a 1:28.432.
Caption12Data sourced from FastF1 and F1DB. Updated weekly.
Data13+0.347s P3 LAP 42/57 MEDIUM
Nav13Races Season Drivers Constructors

Spacing

xs4px
sm8px
md12px
lg16px
xl20px
2xl24px
3xl32px
4xl40px
5xl48px

Border radius

none0px
sm4px
md8px
lg8px
full999px

Component patterns

Card

Australian Grand Prix
Melbourne, Australia — Round 1
FP1FP2FP3QR

Timing Row

1VERLEADER28.43234.21825.671
2NOR+0.347s28.56134.38225.725
3LEC+0.892s28.71234.19526.106

Buttons

Badges & Tags

SMHPITDNFP1FASTESTDRS

Motion states

RED FLAGFlag Pulse
DRS OPENDRS Pulse
PITPop In
+0.347sAppear
LOADINGBlink
312 km/hValue Flash

Design principles

Data-First
Every pixel serves the data. No decorative elements that compete with telemetry traces, timing tables, or championship standings.
Adaptive Surfaces
Neutral light and graphite dark surfaces keep team colors and telemetry readable. Glass is reserved for toolbars and selection controls.
Mono Precision
Monospace for all timing data ensures perfect column alignment. Numbers must be instantly scannable at a glance.
F1 Red Sparingly
#E10600 is reserved for the logo, primary actions, and critical states (red flags, brake traces). Overuse dilutes its impact.
Team Colors Are Sacred
Official team colors are the primary visual differentiator. Never modify, lighten, or override them for aesthetic reasons.
Motion With Purpose
Animations signal state changes — new data arriving, flags waving, DRS activation. Decorative animation is never used.

F1THEDATA Brand Identity v1.0 — Internal reference for design consistency.