Cara Penggunaan
- Masukkan nilai
Isi kolom yang diperlukan.
- Klik hitung
Tekan tombol hitung untuk melihat hasil.
- Lihat hasil
Lihat hasil dan bagikan jika perlu.
Apa itu konversi kode warna?
Konversi kode warna berarti menyatakan warna yang sama dalam sistem notasi berbeda seperti HEX, RGB, dan HSL. Layar menciptakan warna dengan mencampur warna primer cahaya — merah, hijau, dan biru — sehingga setiap warna pada akhirnya menyusut menjadi intensitas tiga kanal RGB. HEX memampatkan nilai RGB ini menjadi string heksadesimal enam digit (#RRGGBB), sedangkan HSL menata ulang sesuai cara manusia memersepsi warna, menggunakan sudut rona, saturasi, dan kecerahan.
Mengapa konversi penting
- Menulis CSS — Ambil kode HEX dari mockup dan ubah ke RGB, yang memudahkan penyesuaian transparansi.
- Penyesuaian warna — Saat hanya ingin sedikit menggelapkan warna, mengonversi ke HSL memungkinkan Anda mengatur hanya nilai L.
- Kolaborasi — Jaga keselarasan HEX Figma desainer, variabel RGB pengembang, dan acuan warna tim cetak.
Apa pun format yang Anda masukkan, konverter ini menghitung semua format lain sekaligus dan menampilkan warna sebenarnya dalam pratinjau.
Rumus konversi
HEX → RGB membagi bilangan heksadesimal menjadi pasangan dua digit dan membaca masing-masing sebagai bilangan desimal.
R = parseInt(hex[0:2], 16); G dan B dihitung dengan cara yang sama. Contoh: #FF5733 → FF=255, 57=87, 33=51 → RGB(255, 87, 51).
RGB → HSL pertama-tama menormalkan setiap kanal ke rentang 0-1, lalu menghitung kecerahan.
L = (max + min) / 2S = delta / (2 − max − min) (ketika L > 0,5)
dengan delta = max − min. Pada contoh di atas, max=1 dan min=0,2 menghasilkan L = 0,6 (60%), S = 0,8/0,8 = 100%, dan sudut rona H ≈ 11°, yang dikonversi menjadi HSL(11°, 100%, 60%).