Basis Theory
Clinical and rigorously engineered. Clean white layouts and dark terminal-style panels frame intricate isometric payment architecture schematics, illuminated by sharp cyan and lime accents.
Visit siteColour
Background#ffffff
Text#18181b
Accent#94faf0
Surface#27272a
Muted#71717a
Typefaces
- Display
- Inter
- Body
- Inter
- Mono
- Kode Mono
- Source
- Scale
- 12 · 14 · 16 · 24 · 32 · 80
Layout
- Grid
- —
- Container
- —
- Spacing base
- 4px
- Radius
- 8px · 16px · 9999px
Capture
- Category
- finance
- Sections
- 12
- Captured
- 2026-08-30
- Rhythm
- light x6 → dark x2 → light → dark → light
Type rules
- display headlines set tight in bold grotesk with negative tracking
- technical code snippets and infrastructure tags rendered in monospace
- body text constrained to comfortable reading lengths with clear hierarchy
Colour rules
- dominant crisp white and deep slate backgrounds punctuated by mint cyan and lime accents
- neon accent reserved for primary action pills, active status pills, and isometric focal points
Voice rules
- lead with developer-first payment infrastructure clarity
- use high-precision engineering terminology without marketing fluff
Holds it together
- pair every major use-case feature with an isometric architecture diagram
- use pill-shaped badges with micro-labels for integration tags and compliance standards
- alternate between clean white product surfaces and deep charcoal developer modules
Contrast
text on background17.7:1 AAA
muted text on background4.8:1 AA
text on surface1.2:1 fail
accent on background1.2:1 fail
background on accent1.2:1 fail
Type, measured
- Body
- 12px / 1
- Measure
- 117 characters
- Display
- 80px / 0.8
- Tracking
- -0.04em display
- Scale ratio
- 1.61
Voice
- Tone
- technical, authoritative, precise
- Sentences
- medium
- Person
- second
- Vocabulary
- technical
- Calls to action
- request, start, explore, talk
Built with
- Builder
- framer
- Framework
- —
- Motion
- —
- WebGL
- —
- Nav
- —
- Length
- 7.6 screens
Sections in page order
3 marked strong · 12- 00
hero
A crisp clinical fintech hero pairing stark typography and pill indicators with an isometric technical illustration.
- Mood
- clinical + bold
- Layout
- 2 col · split · balanced
- 01
feature
Clean, highly structured feature intro relying on precise typography and multi-column body text over ample whitespace.
- Mood
- clinical + quiet
- Layout
- 1 col · grid · airy
- 02
feature
Crisp developer-focused feature section pairing concise bullet points with an isometric system architecture diagram topped by code.
- Mood
- clinical + quiet
- Layout
- 1 col · split · balanced
- 03
feature
Crisp technical feature section pairing an isometric infrastructure diagram with developer-focused typography and capability bullet points.
- Mood
- clinical + raw
- Layout
- 2 col · split · balanced
- 04
feature
Clean developer-focused feature section pairing structured benefits copy with an isometric payment architecture schematic.
- Mood
- clinical + quiet
- Layout
- 2 col · split · balanced
- 05
feature
Clean, engineered feature section pairing an isometric technical diagram with developer-focused typography and high-contrast callouts.
- Mood
- clinical + raw
- Layout
- 2 col · split · balanced
- 06
testimonial
Dark, restrained testimonial quote with selective word weighting set over a fine diagonal hatch texture.
- Mood
- clinical + quiet
- Layout
- 1 col · centered · balanced
- 07
feature
StrongA sleek, developer-centric feature showcase pairing high-tech isometric hardware graphics with neon accents and precise icon cards.
- Mood
- clinical + bold
- Layout
- 1 col · stacked · balanced
- 08
statement
Minimal, clean statement banner with precise monospace eyebrow and centered security-focused typography.
- Mood
- clinical + quiet
- Layout
- 24 col · centered · balanced
- 09
feature grid
StrongPrecise, modular compliance badges styled like clean hardware plates with pastel security icons and screw accents.
- Mood
- clinical + quiet
- Layout
- 4 col · grid · balanced
- 10
cta
StrongSleek dark-mode call-to-action card featuring crisp white typography and a high-contrast pill button against subtle fabric folds.
- Mood
- bold + clinical
- Layout
- 1 col · stacked · balanced
- 11
footer
A clean, highly structured multi-column developer platform footer anchored by a high-contrast dark copyright bar.
- Mood
- clinical + quiet
- Layout
- 1 col · grid · balanced
