Fondasi visual, konsisten & aksesibel.
Token warna, tipografi, dan komponen yang menyatukan pengalaman lintas layanan SIKONENG — dari UMKM hingga mobilitas dan talenta.
Palet Warna
Primary Green, Primary Yellow, White, Dark Navy, dan skala gray.
Primary Green
bg-primary
Primary Yellow
bg-accent
Dark Navy
bg-secondary
White
bg-background
Semantic States
Gray Scale
50
100
200
300
400
500
600
700
800
900
Tipografi
Plus Jakarta Sans (display) · Inter (body).
Display / H1
Kedaulatan Digital.
Heading / H2
Untuk Rakyat Indonesia
Heading / H3
Satu ekosistem, banyak layanan
Body
SIKONENG menghubungkan UMKM, mobilitas, dan talenta bangsa dalam satu platform terintegrasi yang cepat, adil, dan berdaulat.
Caption
Diperbarui 12 menit yang lalu · Jakarta, Indonesia
Buttons
Variasi utama, sekunder, dan status.
Badges
Label ringkas untuk status dan kategori.
Icons
Lucide icon set · 1.5px stroke.
Avatars
Foto profil dengan fallback inisial.
Cards
Kontainer konten utama.
12.480
+8.4% bulan ini
Cocok untuk banner promo, program pemerintah, dan kampanye.
Forms
Input, select, checkbox, switch, dan textarea.
Tables
Tabel data responsif.
| Merchant | Kategori | Status | Omzet |
|---|---|---|---|
| Warung Bu Tini | Kuliner | Aktif | Rp 24.5jt |
| Batik Sekar | Fashion | Aktif | Rp 18.2jt |
| Kriya Nusantara | Kriya | Menunggu | Rp 9.8jt |
| Kopi Rakyat | Kuliner | Aktif | Rp 31.1jt |
Charts
Recharts dengan token warna brand.
Transaksi (6 bulan)
Volume per Layanan
Feedback
Alert, progress, skeleton, dan toast.
Fitur baru!
Gagal memuat
Skeleton
Overlays
Modal, drawer, dan tabs.
Layouts
Shell siap-pakai untuk halaman publik & dashboard.
Public Layout
Navbar + Footer, cocok untuk landing & marketplace.
Dashboard Layout
Sidebar responsif + Navbar + Bottom Nav.
Mobile Bottom Nav
5-item fixed nav, mengikuti safe area.