What is Chime's primary brand color?

Chime's brand voltage is a saturated leaf green captured as hex 1ec677 in the documented brand palette — a warm, slightly yellow-shifted green that reads as friendly rather than institutional. It carries the wordmark, the app icon background, every primary CTA pill on the marketing site, and the active-state highlight inside the product. The green is paired with a warm cream canvas rather than the institutional pale-blue or pale-gray that legacy US banks use; the warm-on-warm pairing is the single chromatic signature of the brand. Note: the live extraction was blocked by a Cloudflare bot challenge, so the tokens here reconstruct the documented surface rather than reading from a live page render.

What typeface does Chime use, and what should I use as a substitute?

Chime's marketing site uses a humanist sans family across every typographic tier — display, heading, body, button, label. The captured page returned a system-ui fallback stack rather than the actual brand family, so the documented tokens here use the system-ui safety stack as a placeholder. The visible brand identity in app screenshots and marketing collateral suggests a Circular-style or General-Sans-style humanist grotesque — friendlier proportions than Helvetica or Inter, with slightly open counters and a soft terminal on lowercase. For a substitution that matches the documented brand feel, General Sans, Inter at 95% line-height, or DM Sans all read close enough.

Why does Chime use a cream canvas instead of pure white?

Chime's off-white surfaces render as a warm cream rather than pure 0xffffff white. The choice is deliberate and consistent — the cream warms the saturated leaf-green voltage and signals approachability rather than the institutional pale-blue or pale-gray that legacy banks use as their canvas tone. Cream-on-green warmth is the brand's structural pairing; replacing the cream with pure white would tip the system toward the colder mobile-app vocabulary of a typical fintech and lose the warmth that distinguishes Chime from category siblings.

Why does the Chime extraction report so few tokens?

The live design-extractor run against chime.com returned a Cloudflare bot-challenge interstitial rather than the actual Chime marketing page. The two captured colors (hex 313131 and hex 0000ee) and the system-ui typography stack belong to the Cloudflare challenge page, not to Chime. The tokens documented below are reconstructed from public brand sources (the Chime app, the marketing screenshots, the documented brand palette) rather than from a live page render. Treat them as a documented best-guess starting point rather than as an exact snapshot of the live tokens; a re-run from an authenticated browser session or via Chime's own brand portal would produce a higher-fidelity capture.

Can I use this DESIGN.md to build my own US neobank marketing site?

Yes — the file is designed to be fed into Claude, Cursor, or any AI tool that reads structured design tokens. The agent will reproduce Chime's documented moves: leaf-green primary voltage held to the wordmark and primary CTAs, cream-not-white canvas, humanist sans across every tier, and rounded mobile-app geometry instead of square legacy-banking corners. You can also reference the tokens directly: every hex, font name, radius, and spacing value is a quoted scalar you can paste into Tailwind config or CSS variables. One caveat: the live extraction was bot-blocked, so the token values here are documented best-guesses; you may want to verify the exact hexes against your own captures before shipping production CSS.

Chime Design System

Chime's brand identity for a mobile-first US neobank — leaf green primary, cream canvas, friendly humanist sans, rounded geometry that signals accessibility rather than institutio…

About Chime DESIGN.md

Curated by Dov AzencotUpdated May 18, 2026Source chime.com

Banking & Payments

Chime's brand identity inverts the visual conventions of US retail banking. Where Chase leans on a navy-blue serif wordmark with marble-and-glass institutional photography, and where Wells Fargo carries a deep red and a stagecoach mark that signals 170 years of incumbent history, Chime's marketing surface centers on a saturated leaf-green primary, a cream off-white canvas, rounded card geometry, and a humanist sans across every tier. The intended reading is conversational rather than institutional — the brand targets a younger US demographic that grew up with mobile-first finance apps and reads the legacy banks' navy-and-serif chrome as unfriendly. Chime's CTA pills, card surfaces, and small-caps labels all sit in the same softened mobile-app vocabulary the app itself uses; the marketing site is closer in spirit to a Cash App or a Venmo landing page than to a traditional bank's investor-relations portal.

The DESIGN.md file packages the documented brand surface into a machine-readable spec for React tooling. Inside: 12 color tokens — one leaf-green voltage, two secondary product accents, a cream canvas, the warm-gray ink ladder, and a hairline tone for card outlines; 10 typography tokens running a humanist sans from a 40px / 600 display down to a 12px / 400 caption; 4 corner-radius tokens centered on 12-16px with a full-pill option for CTAs; 8 spacing values on an 8px base; and 14 component definitions covering the leaf-green pill primary button, the white-on-cream secondary, the rounded mobile-app cards, the small-caps category labels, and the marketing top-nav.

Feed this file to an AI coding tool and it reproduces Chime's specific brand moves: leaf-green voltage held to wordmark and primary CTAs, cream-not-white canvas, humanist sans across every tier, and rounded mobile-app geometry instead of the squarer corners that traditional banking sites use. The one move worth borrowing only if you target a younger demographic underserved by incumbents: the willingness to look like a mobile app rather than like a legacy institution. Chime's marketing surface trades institutional gravity for tappable approachability — a trade that signals "different from your parents' bank" more clearly than any tagline could.

What makes it distinct

Leaf-green primary voltagethe brand green carries the wordmark, the app icon, and every primary CTA, the single chromatic move on the marketing surface
Cream canvas, not whiteChime's off-white is a warm cream that softens the saturated green and signals approachability rather than institutional authority
Humanist sans across every tierfriendly grotesque proportions rather than the serif-anchored display family that legacy banks use
Rounded geometrycard and button radii sit at 12-16px to read as tappable mobile UI rather than as desktop banking chrome
Mobile-first compositionthe marketing site mirrors the app's vertical card stack rather than leaning on a horizontal desktop grid

Live at chime.com

A snapshot of the brand in production. Hover the frame to scroll the page; click to visit.

chime.com

Explore Chime

Pick what you want to see — mockups, colors, typography, layout, or the full component list.

Brand & Accent

Sparing, CTA-only voltage.

Surface

Page and card backgrounds.

Text

Headlines, body, captions, muted.

Borders & Hairlines

Dividers, outlines, structural rules.

Other

Specialty colors.

Chime design system FAQ

Common questions about Chime's tokens, components, and how to use this DESIGN.md in your project.

Specs, directories, and component libraries that pair with this design system.

Browse all design systems

The full directory of DESIGN.md files on shadcn.io, with live mockups for each.

Chime — official site

Chime's public marketing site — the source of truth for the live tokens this file documents.

The DESIGN.md specification

Google Labs' open spec for machine-readable design system files — the format this page is built on.