Konversi warna
Konverter warna online gratis yang mengenali HEX (3, 4, 6, 8 digit), rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), sintaks CSS Color 4 baru (dipisah spasi), semua 147 warna bernama CSS dan apa pun di antaranya dengan alpha. Mengeluarkan setiap format sekaligus, dapat disalin secara individual. Palet bawaan menghasilkan shade (langkah lebih gelap), tint (langkah lebih terang), komplementer, analog, triadik, dan tetradik. Pemeriksa kontras WCAG menunjukkan apakah warna memenuhi AA / AAA terhadap putih dan hitam untuk teks normal dan besar. Buka eyedropper OS (Chrome / Edge) untuk memilih warna apa pun di layar.
Cara menggunakan
Format apa pun: HEX, RGB, HSL, OKLCH, bahkan nama CSS seperti tomato.
Sebelas muncul sekaligus, salin dengan satu klik.
Shade, tint, dan harmoni diturunkan dari warna Anda.
Kontras WCAG terhadap putih dan hitam dengan vonis AA/AAA.
Konversi antara 11 format warna, buat palet, periksa kontras WCAG — semua di satu tempat
Semua format
Kontras (WCAG)
Palet
Terbaru
Fitur
Penggunaan umum
- Cari OKLCH dari warna HEX merek untuk sistem desain CSS Color 4.
- Konversi nilai piksel RGB dari screenshot ke HSL untuk sumbu grafik.
- Temukan warna komplementer untuk state hover tombol.
- Periksa apakah teks body memenuhi WCAG AA terhadap latar yang dipilih.
- Pilih warna dari tab atau jendela lain via eyedropper sistem.
Mengapa yang ini
Banyak konverter hanya melakukan HEX↔RGB↔HSL. Kami menyertakan OKLab dan OKLCH — ruang baru CSS Color 4 yang cocok dengan persepsi manusia jauh lebih baik daripada HSL (tanpa lompatan kejutan dalam kecerahan saat mengubah hue). Pembangkitan palet berjalan di OKLab sehingga langkah-langkah terlihat seragam secara perseptual, bukan secara matematis. Kontras dihitung dalam ruang luminansi WCAG 2 dengan ambang 4.5:1 dan 3:1 yang dieja.
Pertanyaan umum
Apa itu OKLCH?
Ruang warna seragam secara perseptual yang diperkenalkan sebagai bagian dari CSS Color 4. Tidak seperti HSL — di mana kecerahan 50% bisa terlihat sangat berbeda pada hue yang berbeda — kecerahan OKLCH konsisten di seluruh spektrum, yang membuat token desain dapat diprediksi. Jika Anda membangun sistem desain modern, OKLCH layak dipelajari.
Apakah warna saya menyertakan alpha?
Ya — apa pun dari HEX delapan digit, rgba(), hsla(), atau sintaks spasi sufiks alpha (rgb(255 0 0 / 50%)) diparsing dan tercermin di setiap format output yang mendukung alpha.
Mengapa palet shade saya terlihat "berundak" alih-alih halus?
Shade dan tint diinterpolasi di OKLab dan kemudian diproyeksikan ke ruang target Anda, sehingga setiap langkah secara perseptual sama — itu sering menghasilkan hasil yang terlihat lebih halus secara visual daripada perubahan kecerahan HSL naif, tetapi warna awal yang sangat gelap atau sangat terang terpotong di dekat titik akhir.
CMYK — akurat untuk cetak?
Tidak — output CMYK adalah konversi ruang layar cepat, bukan yang sadar profil ICC. Untuk cetak, ambil CMYK yang Anda lihat di sini sebagai titik awal dan verifikasi di tooling Adobe / Affinity terhadap profil pers sebenarnya.
Eyedropper tidak berfungsi — kenapa?
EyeDropper API hanya tersedia di browser berbasis Chromium (Chrome, Edge, Brave) saat ini. Firefox dan Safari akan menyembunyikan tombol dengan tooltip jika tidak didukung.
Apakah nama HEX peka huruf besar/kecil?
Tidak, HEX adalah hex (0-9, a-f atau A-F). Kami mengeluarkan huruf kecil secara default untuk mencocokkan rekomendasi CSS Color 4; output tetap valid bagaimanapun Anda menempelkannya kembali.
Mobile?
Ya. Eyedropper tidak tersedia di browser mobile — gunakan pemilih warna native sebagai gantinya.
Kami bisa — dan gratis! Kirim pesan singkat dengan ide Anda. Jika ingin diskusi lebih detail, tinggalkan email dan kami akan menghubungi Anda. Bisa anonim.
