Pilih warna atau ketik nilai HEX, RGB, atau HSL apa pun dan dapatkan semua format seketika, plus potongan CSS siap salin.
Semua konversi terjadi secara lokal di browser Anda. Tidak ada yang meninggalkan perangkat Anda.
color: #3498db;background-color: rgb(52, 152, 219);background-color: hsl(204, 70%, 54%);Setiap warna di layar hanyalah sekumpulan angka dalam sistem koordinat. Tiga sistem di bawah ini menggambarkan warna yang sama dengan cara berbeda: kode HEX, triple RGB, dan triple HSL untuk #3498db adalah biru yang persis sama. Mengetahui ketiganya memudahkan membaca spesifikasi desain, memperbaiki galat pada lembar gaya, dan membuat varian warna.
HEX adalah notasi ringkas basis-16 untuk nilai RGB (#rrggbb). RGB mencampur kanal merah, hijau, dan biru, masing-masing 0 hingga 255. HSL menggambarkan warna lewat rona, saturasi, dan kecerahan, yang sesuai dengan cara manusia memaknai warna dan memudahkan pembuatan nuansa serta variasinya.
Ketiganya berfungsi di semua browser modern. HEX paling singkat dan paling umum untuk serah terima desain ke pengembangan. RGB praktis ketika Anda perlu menyusun nilai rgba() dengan alfa. HSL paling cocok ketika Anda ingin mengatur kecerahan atau intensitas warna tanpa mengubah rona dasarnya.
Kode pendek seperti #f0a adalah singkatan: tiap digit digandakan, jadi #f0a menjadi #ff00aa. Alat ini menerima HEX 3 digit dan 6 digit, dengan atau tanpa # di depan.
Rona (0–360°) dipetakan pada roda warna, lalu saturasi dan kecerahan mengatur skala warna ke arah abu-abu atau hitam. Rumus standar HSV ke RGB melakukan perhitungannya, dan hasilnya dibulatkan ke bilangan bulat 0–255 terdekat untuk tiap kanal.
Ya. Saat Anda mengetik, alat ini menguraikan tiap isian dan hanya memperbarui contoh warna serta isian lain ketika nilainya valid. Angka di luar rentang, format yang salah, atau komponen yang kurang membuat warna terakhir yang valid tetap terpakai sampai Anda memperbaiki masukan.
Jika warna pilihan Anda sudah final, lanjutkan alurnya: konversi nilainya dengan Konverter HEX ke RGB, ambil palet langsung dari foto dengan Pengambil Warna dari Gambar, dan periksa bagaimana hasilnya terlihat bagi semua orang di Simulator Buta Warna sebelum dirilis.
Jika Anda baru saja memakai Konverter warna, langkah berikutnya yang wajar adalah Pembuat palet warna, Pemeriksa kontras warna, Generator gradient CSS, atau telusuri semua alat Alat file privat.