Personality

Clean, calm, slightly warm

Kareem POS dioptimalkan untuk kecepatan kasir dan kejelasan di shift 8+ jam. Satu brand accent (warm gold), tanpa gradients di surfaces, tanpa dekorasi yang tidak perlu. Fast interaction > visual decoration.

Fast first

Kasir screen tidak boleh terasa seperti dashboard admin. Setiap elemen harus bisa dibaca dan diklik dalam 0.5 detik.

Mono for money

Nominal Rupiah, order number, dan quantity selalu menggunakan Inter Tight tabular numbers.

Brand gold sparingly

#B19849 hanya untuk primary CTA, active tabs, dan focus rings. Jangan dipakai untuk body text.

No gradients on surfaces

Background: solid #FAFAFA. Surfaces: solid #FFFFFF. Gradients hanya boleh ada di landing page, bukan product screens.

Color / Brand

Warm gold palette

--brand-25#FDFCF5

--brand-50#FBF8EE

--brand-100#F5EEDA

--brand-200#ECDFB3

--brand-300#DDCA85

--brand-400#C9B065

--brand-500 ★#B19849

--brand-600#97803A

--brand-700#8A773A

--brand-800#6E5E2E

--brand-900#4D4220

--brand-950#2E2713

Color / Neutral

Gray scale

--gray-25#FDFDFD

--gray-50#FAFAFA

--gray-100#F5F5F5

--gray-200#E9EAEB

--gray-300#D5D7DA

--gray-400#A4A7AE

--gray-500#717680

--gray-600#535862

--gray-700#414651

--gray-800#252B37

--gray-900#181D27

--gray-950#0A0D12

Color / Semantic

Status colors

--success-500#17B26A

--success-700#067647

--warning-500#F79009

--warning-700#B54708

--error-500#F04438

--error-600 ★#D92D20

--error-700#B42318

Color / Surfaces

Backgrounds

--bg-primary#FFFFFF

--bg-secondary#FAFAFA

--bg-tertiary#F5F5F5

--bg-brand-subtle#F9F6EE

Color / Foreground

Text & icon colors

--fg-primary#181D27

--fg-secondary#535862

--fg-tertiary#717680

--fg-quaternary#A4A7AE

--fg-brand#B19849

--fg-error#B42318

Color / Borders

Border tokens

--border-primary#E9EAEB

--border-secondary#D5D7DA

--border-brand#B19849

Typography

Inter Tight — satu typeface, semua peran

36px / 700 / -0.02emDashboard performa

24px / 700 / -0.01emProduk terlaris

20px / 700Rp 3.450.000

18px / 500Mamakoko Santan

18px / 600Rp 10.000

16px / 400Bumbu Dapur

14px / 400Cashier · Order List · Inventory

12px / 600 / 0.06em / uppercaseREPORTS

Spacing

4px base grid

--s-1 · 4px

--s-2 · 8px

--s-3 · 12px

--s-4 · 16px

--s-5 · 20px

--s-6 · 24px

--s-8 · 32px

Radius

Rounded geometry

--radius-sm · 6px

--radius-md · 8px

--radius-lg · 12px

--radius-xl · 16px

--radius-full · 9999px

Elevation

Shadows

shadow-xsResting card

shadow-smLifted card

shadow-mdHover card

shadow-buttonPrimary button

Controls

Buttons, badges & inputs

Buttons — Filled

Buttons — Secondary

Buttons — Tertiary & Link

Status Badges

PendingProcessingCompletedCancelled

Brand Subtle Chips

Ayo KurbanDAFPre OrderIkan

Text Inputs

Cashier Tempo

Product grid + cart

Ayo KurbanDAFIkanDaging

Mamakoko SantanBumbu DapurRp 10.000

Tepung BerasBahan PokokRp 8.500

Ikan PatinIkanRp 32.000

Daging SapiDagingRp 145.000

Manager Tempo

Metrics + ledger

Total RevenueRp 3.450.000

Orders42

Completion87.5%

Order #	Status	Total
ORD-001	Completed	Rp 74.000
ORD-002	Pending	Rp 22.000
ORD-003	Cancelled	Rp 55.000