Mehbit — Brand & Design System

01

Colour

A committed dark world. Blue is the one action colour; teal marks the good news — free, verified, works. Everything else is neutral, tuned slightly cool toward the blue.

Surfaces

--color-bg#07090ePage ground

--color-bg-elevated#0d1119Raised sections, footer

--color-surface-solid#121820Cards, inputs

--color-surfacergba(255, 255, 255, 0.04)Subtle fills, pills

--color-borderrgba(255, 255, 255, 0.09)Hairline dividers

--color-border-strongrgba(255, 255, 255, 0.16)Emphasised edges

Text

--color-text#f4f6faPrimary text

--color-text-muted#9aa3b5Secondary / lead

--color-text-subtle#8991a1Captions, meta

Brand

--color-primary#3d6ef5Primary action, links

--color-primary-hover#2f5fe0Hover / pressed

--color-accent#5eead4Highlights: free, verified

--color-accent-mutedrgba(94, 234, 212, 0.12)Accent fills

Status & network

--color-success#16a34aWorks / verified

--color-danger#dc2626Blocked / unsupported

--color-network-visa#6ea0ffVisa mark

--color-network-mc-a#eb001bMastercard

02

Typography

Peyda across Persian, English, and social — one face, no fallbacks. Latin and Persian numerals both sit on a tabular baseline for aligned figures.

Hero · 800 · clamp(2–3rem)

Crypto-funded cards for real payments

Title · 800 · clamp(1.75–2.25rem)

Top up with USDT, spend worldwide

Section · 800 · clamp(1.5–1.85rem)

Supported services

Body · 400 · 1rem / 1.75

Issue a Visa or Mastercard, load it from your crypto wallet, and pay anywhere cards are accepted — Apple Pay and Google Pay included.

Label · 600 · 0.8rem · +0.04em

PAYMENT TESTED

Weights

Ag 1234

Light300Rarely — large display only

Ag 1234

Regular400Body copy

Ag 1234

Medium500Nav, labels

Ag 1234

SemiBold600Emphasis, buttons

Ag 1234

Bold700Sub-headings

Ag 1234

ExtraBold800Titles, hero

Ag 1234

Black900Sparingly

03

Radius, elevation & motion

Radius

--radius-sm · 8

--radius · 14

--radius-lg · 20

--radius-full

Elevation

shadow-sm

shadow-md

shadow-glow

Motion

--easecubic-bezier(.22, 1, .36, 1) One easing everywhere.

04

Components

The identity-carrying pieces. Rebuilt from the same tokens the website ships.

Buttons

Badges & pills

VAT-free✓ Payment testedNot supportedApple PayGoogle Pay

Mehbit)))

4921 •••• •••• 7048

CARDHOLDERVALID THRU08/29

▶Streaming

Netflix

Subscribe worldwide with a Mehbit card. Works on the first try, no local billing address needed.

Works→

05

Logo

A monochrome “M”, drawn as two strokes and a check. It carries no colour and no ground of its own: use mehbit-icon on light grounds and mehbit-icon-dark on dark ones. The one exception is mehbit-icon-tile — the brand ground #07090e as a tile, with the mark knocked out in white — for slots that cannot supply a ground of their own, like favicons, home-screen icons and email.

Mehbit

Keep clear space of at least 25% of the mark's width on every side.
Reach for the dark icon on dark grounds — don't invert() the light one.
Wordmark is Peyda ExtraBold, letter-spacing −0.02em, beside the mark.
Don't recolour the mark, add a gradient, or place it on a busy photo.
Don't stretch or rotate it, and don't build your own coloured tile — mehbit-icon-tile is the only boxed form.

06