Paddle

Refined financial architecture meets editorial prestige. Airy warm-neutral grounds and elegant condensed serif headlines replace typical tech-modern flash with an authoritative, magazine-like composure. A single vibrant yellow accent delivers sharp focal contrast against deep charcoal and warm paper surfaces.

editorial quiet bold

Visit site

Colour

Background#f9f8f7

Text#1c1a15

Accent#ffd400

Surface#ebe7df

Muted#d9d3c9

Typefaces

Display: serrifCondensed
Body: Inter
Mono: monospace
Source: self_hosted
Scale: 10 · 11 · 14 · 16 · 20 · 24

Layout

Grid: 12 columns
Container: 1248px
Spacing base: 4px
Radius: 8px · 16px

Capture

Category: finance
Sections: 8
Captured: 2026-08-30
Rhythm: light x6 → dark x2

Type rules

display headlines use high-contrast condensed serif in sentence case
body text rendered in neutral sans-serif at roughly 52 characters measure
metric counters pair large serif figures with all-caps monospace labels

Colour rules

warm paper-like neutrals dominate surfaces and page backgrounds
vibrant yellow is reserved strictly for high-priority CTA callouts and icon accents
deep charcoal provides contrast for primary buttons and lower-page transition bands

Voice rules

lead with brief, period-terminated serif statements
metrics and labels are formatted in uppercase or tabular numerals

Holds it together

render display headlines in condensed serif with sentence casing and period punctuation
frame interactive mockups and stat containers with soft, warm-neutral pill cards and hairline borders
restrict the bright yellow accent to primary action pills and featured conversion modules

Contrast

text on background16.4:1 AAA

muted text on background1.4:1 fail

text on surface14.1:1 AAA

accent on background1.4:1 fail

background on accent1.4:1 fail

Type, measured

Body: 20px / 1.5
Measure: 52 characters
Display: 64px / 1
Tracking: -0.01em display
Scale ratio: 1.34

Voice

Tone: authoritative, understated, sophisticated
Sentences: short
Person: third
Vocabulary: plain
Calls to action: book, get, discover, learn, see

Built with

Builder: —
Framework: next
Motion: —
WebGL: —
Nav: top_bar, 56 items
Length: 7.1 screens

Sections in page order

3 marked strong · 8

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

00
hero
An airy, editorial SaaS hero pairing refined condensed serif typography with warm neutral tones and restrained logo proof.
Mood
editorial + quiet
Layout
12 col · stacked · airy
Open section →
01
feature
Warm-neutral product feature showcase pairing refined serif typography with layered fintech UI mockups.
Mood
editorial + quiet
Layout
16 col · split · airy
Open section →
02
statement
Quiet and refined text banner pairing elegant serif typography with a subtle pill button on a warm neutral ground.
Mood
quiet + editorial
Layout
12 col · centered · airy
Open section →
03
stats
Strong
An elegant, editorial case-study and proof section pairing condensed serif typography with crisp monospace metrics and soft rounded cards.
Mood
editorial + clinical
Layout
13 col · grid · balanced
Open section →
04
feature
Clean and restrained split feature section with elegant serif typography and minimalist icon-led benefit points over a warm neutral background.
Mood
editorial + quiet
Layout
12 col · split · airy
Open section →
05
cta
Strong
Vibrant canary-yellow card structured by subtle intersecting gridlines, pairing an elegant serif headline with crisp pill-shaped action buttons.
Mood
bold + editorial
Layout
16 col · asymmetric · airy
Open section →
06
cta
Strong
Crisp dark three-column gateway section with refined serif headings, fine structural borders, and punchy yellow arrow buttons.
Mood
editorial + quiet
Layout
3 col · grid · balanced
Open section →
07
footer
A dense dark multi-column footer pairing refined serif category headings with clean sans-serif navigation links and an accent hiring pill.
Mood
quiet + clinical
Layout
12 col · grid · balanced
Open section →