FOR THE WORLD

A world beyond cash.

Mastercard connects consumers, financial institutions, merchants, and governments to the world's most secure, innovative, and inclusive digital economy.

Color Palette22 tokens

background#f3f0ee

surface#fcfbfa

surface-pure#ffffff

surface-cool#f4f4f4

ink#141413

on-primary#f3f0ee

brand-red#eb001b

brand-yellow#f79e1b

charcoal#262627

primary#cf4500

signal-light#f37338

clay-brown#9a3a0a

slate-gray#696969

granite#555555

graphite#565656

dust-taupe#d1cdc7

link-blue#3860be

watermark#e8e2da

border-soft#e8e2da

shadow-nav#ebe9e7

shadow-card#dcd8d4

shadow-deep#a8a39e

Buttons

TypographyGoogle Font

Hanken Groteskbrand uses MarkForMC

Priceless possibilities, powered by trust.

64px · 500 · -1.28px

Connecting everyone to priceless

36px · 500 · -0.72px

Mastercard connects consumers, financial institutions, merchants, and governments to the world's most secure, innovative, and inclusive digital economy.

24px · 500 · -0.48px

• SERVICES · FOR BUSINESS

14px · 700 · 0px

eyebrow

Mastercard connects consumers, financial institutions, merchants, and governments to the world's most secure, innovative, and inclusive digital economy.

14px · 700 · 0.56px

IconsSolar

Set: Solar · brand-matched

Formfocus ring

you@company.com

Password

••••••••

Card · Shapes

Connecting everyone to priceless

Mastercard connects consumers, financial institutions, merchants, and governments to the world's most secure, innovative…

Finance

none

micro

button

consent

Elevation

RING

CARD

ELEVATED

Controls

Off

✓Checked

Unchecked

Selected

Option

Alerts

Heads up — a new version of the design system is available.

Saved. Your changes are live across all surfaces.

Some tokens are missing a contrast-safe pairing.

Couldn’t reach the server. Retry in a moment.

Badges

SolidSoftOutlineNewv2.0

FAQ

Connecting everyone to priceless

Mastercard connects consumers, financial institutions, merchants, and governments to the world's most secure, innovative, and inclusive digital economy.

How does it integrate with my stack?

Is there a free tier?

Tabs

OverviewActivitySettings

DayWeekMonth

Stats

48.2k

Active users

+12.4%

$12.8k

MRR

+3.1%

99.9%

Uptime

−0.02%

Table

Member	Plan	Status
AQAvery Quinn	Pro	Active
JLJordan Lee	Team	Pending
SRSam Rivera	Free	Active

Avatars

AQJLSR+5

Avery Quinn

Online · Owner

Slider · Progress

Volume62%

Storage used78%

Tooltip · Popover

Brand-styled tooltipHover target

Navigation bar

Banner

Pricing

Pro

$24 /mo

Unlimited projects
Priority support
Custom domains

Stepper

CartDetails3Payment4Review

Breadcrumb

HomeFinanceMastercard

Toast

Changes savedUndo

You have 3 new updates

Activity

Avery created a new project

2h ago

Jordan left a comment

5h ago

Sam shipped v2.0

1d ago

Notifications

AQAvery Quinn invited you to Mastercard.

2 minutes ago

JLJordan Lee approved your design tokens.

1 hour ago

SRSam Rivera mentioned you in a thread.

Yesterday

Code

theme.ts

// Mastercard tokens
export const theme = {
  primary: "#cf4500",
  radius: "8px",
}

Calendar

March 2026

SMTWTFS28291234567891011121314151617181920212223242526272829303112

No resultsTry adjusting your filters or search for something else.

Pagination

‹123…12›

Brand moment

We're here when you need us — because Priceless is a promise, not a price.

Mastercard · Finance

Similar systems

Generated from shared tags, visual DNA, category, color, type, and radius.

Filter by this ↗

Nubank86%

shared styles: Colorful, Light, Bold · same category: Finance

Ramp78%

shared styles: Light, Bold · same category: Finance

Wise77%

shared styles: Light, Bold · same category: Finance

Monzo76%

shared styles: Light, Bold · same category: Finance

Venmo75%

shared styles: Colorful, Light · same category: Finance

Uniswap74%

shared styles: Colorful, Light · same category: Finance