Brand Elements
Color
Menjelaskan penggunaan warna dan penerapannya
Color Palette
Warna adalah elemen penting dalam identitas visual KYZN. Penggunaan warna yang konsisten membantu membangun pengenalan brand.
Primary Colors
Brand Primary
Warna utama yang merepresentasikan KYZN.
| Nama | Hex | RGB | Penggunaan |
|---|---|---|---|
| Primary | #0066FF | 0, 102, 255 | CTA, link, accent |
| Primary Dark | #0052CC | 0, 82, 204 | Hover state |
| Primary Light | #E6F0FF | 230, 240, 255 | Background subtle |
Neutral Colors
Grayscale
Digunakan untuk teks, background, dan border.
| Nama | Hex | Penggunaan |
|---|---|---|
| Black | #000000 | Heading, teks utama |
| Gray 900 | #1A1A1A | Teks body |
| Gray 700 | #4A4A4A | Teks secondary |
| Gray 500 | #8A8A8A | Placeholder, disabled |
| Gray 300 | #D4D4D4 | Border |
| Gray 100 | #F5F5F5 | Background |
| White | #FFFFFF | Background utama |
Semantic Colors
Status Colors
Warna untuk menunjukkan status atau feedback.
| Status | Hex | Penggunaan |
|---|---|---|
| Success | #22C55E | Berhasil, positif |
| Warning | #F59E0B | Peringatan |
| Error | #EF4444 | Error, negatif |
| Info | #3B82F6 | Informasi |
Dark Mode
Background
| Nama | Light | Dark |
|---|---|---|
| Background | #FFFFFF | #0A0A0A |
| Card | #F5F5F5 | #1A1A1A |
| Border | #E5E5E5 | #2A2A2A |
Text
| Nama | Light | Dark |
|---|---|---|
| Primary | #000000 | #FFFFFF |
| Secondary | #4A4A4A | #A0A0A0 |
| Muted | #8A8A8A | #6A6A6A |
Penerapan
Kontras
- Pastikan rasio kontras minimal 4.5:1 untuk teks normal
- Rasio kontras minimal 3:1 untuk teks besar dan UI elements
Aksesibilitas
- Jangan hanya mengandalkan warna untuk menyampaikan informasi
- Gunakan ikon atau teks tambahan untuk status
Konsistensi
- Gunakan warna dari palette yang sudah ditentukan
- Hindari membuat variasi warna baru tanpa persetujuan
Last Update: 26 Desember 2025 pukul 13.50