Design System & Component Library

Fondasi UI modern, corporate, dan clean untuk platform Electronic Memo & Surat (E-MOSU)

Brand Identity & Color Tokens

Palet warna Deep Navy & Modern Blue resmi E-MOSU

Primary Brand Palette (Deep Navy to Modern Blue)

100

200

300

400

500

600 (Primary)

700

800

900

950 (Sidebar)

Status Semantic Badges

Draft Dokumen Diajukan Sedang Berjalan Menunggu Persetujuan Disetujui (Approved) Perlu Revisi Ditolak PDF Final Siap Special / Kondisional

Button Components

Variasi action button interaktif dengan state hover, focus, dan loading

Corporate Form Components

Standard input controls, select, textarea, validation, dan state

Nomor Dokumen *

Kategori Dokumen *

Perihal (Simulasi Error State) *

Perihal dokumen wajib diisi dengan minimal 10 karakter yang jelas.

Catatan / Ringkasan Dokumen

Toast Notifications & Interactive Triggers

Uji coba interactive feedback event toast yang lightweight dan modern

Empty State Component

Tampilan clean saat list data kosong

Belum Ada Pengajuan Memo

Anda belum memiliki draft atau memo aktif yang diajukan ke kantor cabang saat ini.

Buat Memo Baru

Error State Component

Tampilan informatif saat terjadi kendala sistem atau network

Error 503

Layanan Workflow Sedang Sibuk

Sistem tidak dapat memuat approver matrix otomatis. Silakan periksa koneksi atau coba sesaat lagi.

Kembali ke Beranda