Design system

Incrementa tokens and primitives, taken from the Bubble style sheet. Font: Inter.

Colour tokens

--primary

#680228

Buttons, brand

--primary-new

#7A0125

Progress bar, chart red family

--primary-hover

#68011E

Primary hover

--text

#111111

Body text

--app-grey

#64748B

Secondary text

--border

#EBEDEF

Card borders (Border Gray)

--border-ai

#E3E6EB

Outlines (AI Border)

--page-bg

#F9F9FA

Admin page background

--surface

#F7F7F7

Surface

--admin-blue

#000055

Focus ring

--brown

#958B7C

Incrementa Brown

--destructive

#DC2626

Destructive

--success

#17DB4E

Success

--alert

#FAB515

Alert

--input-bg

#F6F7F9

Inputs, dropdowns

--input-error-bg

#FEF1F0

Invalid input

--divider

#F1F2F4

Table row separators

Element colours (dark / light)

Grey#9c9c9c / #E5E7EB

Yellow#FFC300 / #fff6bf

Dark Blue#00008B / #adbce6

Orange#EB8D00 / #FFEDD5

Red#991B1B / #FECACA

Green#179A6B / #DCFCE7

Purple#7906ED / #ECE9FC

Black#111111 / #f3f4f6

Incrementa Red#8d1331 / #fdf2f5

Bright Blue#1e4ed8 / #f0f6ff

Dark Green#293f01 / #e6edda

Invoice status:DraftSentPayment DuePaidCancelled

Chart palette

1 #A8A8A8

2 #7A0124

3 #081F5C

4 #6694D1

5 #7030A0

6 #D1DFF1

Typography

Page title — 24 / 500 / −0.5

Subtitle — 14, App Grey, line-height 1.3

Field label — 14 / 500

Body — 14 / 400

Small button text — 12 / 500

Buttons

Form controls

Company name

Invalid inputShown when invalid and not focused.

Currency

Primary color

Cards

Standard card — 12px radius, 1px Border Gray, padding 16.

Shadow card — Std Shadow variant, padding 6.

Table with growth chips

Hotel	Month	Upsell revenue	MoM	Invoice
Hotel Alba	Sep 2026	$12,480	▲ 8.4%	Paid
Hotel Mar	Sep 2026	$9,310	▼ 3.1%	Payment Due
Hotel Sol	Sep 2026	$4,020	▲ 0.0%	Sent

Tabs, month browser, avatar, modal

October 2026

JMIA