Screenshot of Brex

Brex

brex.com

The reference for a near-white fintech canvas carried by a single orange ember (#ff5900) that owns every primary action, link and play-trigger while everything else stays monochrome.

Fintech flagship

Design tokens

background
surface
text
textMuted
accent
border
tone1
tone2
display
Inter
body
inter
mono

Do / Don't

Reference it for

  • Single-accent restraint: one ember #ff5900 for the Get started button, the inline 'See Brex in action' play link, and tab/active indicators, nothing else chromatic
  • Near-white layered canvas: page sits on #f3f3f7 fog with #ffffff paper sections, no gradient, depth from contrast not shadow
  • Heavy compressed display headline (Flecha-style face) at ~72px, two short lines, tight leading, near-black #000 ink, left-aligned in the left half
  • Muted grey subhead (#8b8d98 / pewter) at ~20px directly under the headline, capped to two lines
  • Inline email-capture: a 12px-radius outlined field with the solid ember button butted to its right edge, as the hero's single conversion unit
  • Hairline-border component language: 1px Mist #b9bbc6 borders and a 12px radius on inputs, cards and buttons, no drop shadows
  • Slim white top nav with a left wordmark, centre dropdown groups (Products / Solutions / Resources), and a Sign in / See a demo / solid Get started cluster right
  • Product-shot hero: a real photographed card plus a phone UI bleeding off the right edge over a soft pink-cream surface with faint orange wireframe traces

Do not copy

  • The Brex wordmark and the bracket-card glyph logo
  • The exact ember-and-abyss palette as a set (#ff5900 + #000710 reads unmistakably as Brex)
  • The Flecha custom display face (licensed bespoke type)
  • The photographed Brex card and Wallet app product render
  • Headline copy 'Finance built for speed and control.' and the '120+ countries' line
  • The black Brex Mastercard with mastercard mark