Design System

The ZAM
Color System

ZeroClick's palette is achromatic at its core — Warm Black and Warm White, extended with a structured neutral scale and functional semantic colors. Color carries meaning, not brand identity.

01 — Foundation

Primary Colors

Warm Black
#0A0A0A
--warm-black
Warm White
#FAFAF9
--warm-white

02 — Neutral Scale

Warm Gray

25
#FCFCFD
50
#F9FAFB
100
#F2F4F7
200
#EAECF0
300
#D0D5DD
400
#98A2B3
500
#667085
600
#475467
700
#344054
800
#1D2939
900
#101828

03 — Semantic

Functional Colors

Success
#079455
--green-800
Error
#D92D20
--red-500
Warning
#DC6803
--yellow-500
Info
#1570EF
--blue-500
Green Tint
#ECFDF3
--green-50
Green Bright
#12B76A
--green-500
Green Dark
#027A48
--green-700

04 — Typography

Type Scale · Inter

Display H1
72px / 800
Advertise in AI.
H2 Section
36px / 600
213M+ high-intent users.
H3 Card
24px / 600
Real tools. Real context.
Body
16px / 400
ZeroClick places contextual ads directly inside AI experiences — developer tools, chat interfaces, coding agents, and more.
Label
12px / 500 / caps
Active · Limited Time · Beta

05 — Components

Buttons & Badges

Buttons
Badges
● Offer ● Limited time Ad New Beta
Ad Card
Advertiser Name Ad

Short, compelling one-liner about what this product does. Contextual and relevant.


06 — Tokens

CSS Variables

/* ZeroClick Brand Tokens */ /* zam-brand-guidelines v1.0 — February 2026 */ :root { /* Foundation */ --warm-black: #0A0A0A; --warm-white: #FAFAF9; /* Neutral Scale */ --gray-25: #FCFCFD; --gray-50: #F9FAFB; --gray-100: #F2F4F7; --gray-200: #EAECF0; --gray-300: #D0D5DD; --gray-400: #98A2B3; --gray-500: #667085; --gray-600: #475467; --gray-700: #344054; --gray-800: #1D2939; --gray-900: #101828; /* Semantic */ --color-success: #079455; --color-error: #D92D20; --color-warning: #DC6803; --color-info: #1570EF; /* Green Scale */ --green-50: #ECFDF3; --green-500: #12B76A; --green-700: #027A48; --green-800: #079455; }