Pemilih warna (HEX, RGB, HSL, OKLCH)
Pilih warna di kotak saturasi–kecerahan atau ketik HEX, RGB, HSL, atau OKLCH. Semua format tetap sinkron, dengan skala tint/shade, eyedropper (Chromium), dan palet yang bisa diekspor ke CSS serta JSON.
Cara memilih dan mengekspor warna
1. Seret pada kotak dan penggeser rona, atau tempel nilai HEX/RGB/HSL/OKLCH.
2. Baca HEX, RGB, HSL, dan OKLCH yang tersinkron di bilah ringkasan.
3. Klik bayangan atau swatch harmoni untuk menjelajahi warna terkait.
4. Salin nilai, tautan ?hex=, atau ekspor variabel CSS / JSON.
Contoh pemilih warna
Terracotta merek #8F665E
Pemilih HSV menjaga rona saat Anda gelapkan untuk hover. Ekspor --color dan --shade-* sebagai variabel CSS.
Palet analog untuk dasbor
Pilih Analog untuk rona ±30° dan ±60°. Salin strip sebagai custom properties untuk kartu dan grafik.
OKLCH untuk langkah merata
Ramp mengubah kecerahan OKLCH agar langkah lebih merata daripada mencampur HEX dengan putih. Gunakan oklch() di CSS modern.
Kapan memakai alat ini
• Saat memilih warna UI dan butuh HEX, RGB, HSL, serta OKLCH sekaligus.
• Saat membuat bayangan hover/muted dari satu rona merek.
• Saat mengekspor palet kecil (harmoni + ramp) ke variabel CSS.
Harmoni untuk palet UI
Komplementer berjarak 180° — kontras kuat, gunakan hemat pada CTA. Analog (±30–60°) menyatukan dasbor. Triadik dan tetradik memberi lebih banyak ragam; turunkan saturasi ekstra agar primary tetap memimpin. Periksa teks dengan pemeriksa kontras WCAG.
Pertanyaan yang sering diajukan
HEX vs RGB vs HSL vs OKLCH?
HEX dan RGB adalah warna sRGB yang sama. HSL praktis untuk rona/kecerahan. OKLCH bersifat perseptual: langkah L serupa terlihat lebih merata, dan oklch() adalah CSS modern yang valid.
Apakah eyedropper bekerja di semua browser?
API EyeDropper ada di Chromium (Chrome, Edge). Di tempat lain, ketik nilai atau gunakan pemilih visual.
Bisakah saya membagikan warna?
Ya. URL diperbarui dengan ?hex=RRGGBB. Salin tautan untuk membuka warna yang sama.
Apakah warna diproses di server?
Tidak. Konversi, harmoni, dan ekspor berjalan lokal di browser.