color/

Nama warna tidak didukung dan akan memunculkan pesan "Format tidak dikenali". Format yang didukung: HEX (3, 4, 6, atau 8 digit, tanda # boleh dihilangkan), rgb() / rgba(), hsl() / hsla(), dan oklch(), dengan argumen dipisahkan koma, atau dipisahkan spasi plus garis miring untuk opasitas (misalnya rgb(255 0 0 / 50%)). Hue pada HSL boleh memakai satuan deg, rad, grad, atau turn. Hasilnya selalu berupa HEX, RGB, HSL, dan OKLCH; tidak ada CMYK maupun HSV.

Alpha ada di dua digit terakhir, ditulis #RRGGBBAA, sama seperti di CSS. Bentuk #AARRGGBB yang umum di Android menaruh alpha di depan, jadi pindahkan dua digit pertama ke akhir sebelum menempelkannya. Dua digit heksadesimal hanya punya 256 tingkat, sehingga 80 (128 dalam desimal) dikonversi menjadi 0.502, bukan 0.5 yang bulat; sebaliknya, alpha 0.5 menghasilkan 80 di akhir HEX.

Jika warna berada di luar jangkauan yang bisa ditampilkan sRGB, alat ini memotong kanal merah, hijau, dan biru ke rentang yang valid secara terpisah, lalu menampilkan warna hasil pemotongan. Nilai seperti rgb() di atas 255 atau saturasi atau kecerahan HSL di atas 100% dipotong tanpa pemberitahuan; hanya OKLCH yang menampilkan pesan "Di luar gamut sRGB", karena OKLCH bisa menggambarkan warna yang lebih intens daripada sRGB. OKLCH di bagian output kemudian dihitung ulang dari warna yang sudah dipotong, sehingga berbeda dari angka yang Anda masukkan. Di layar gamut lebar, menulis oklch() langsung di CSS bisa tampak lebih intens daripada pratinjau di sini.

Alat ini hanya membandingkan warna Anda dengan putih murni dan hitam murni, yaitu menganggapnya sebagai warna teks di atas latar putih dan latar hitam; latar lain tidak bisa dipilih. Algoritmanya mengikuti WCAG 2.x: setiap kanal sRGB diubah ke nilai linear, lalu dibobot dengan 0.2126, 0.7152, dan 0.0722 untuk mendapat luminans relatif L, dan kontras = (L yang lebih terang + 0.05) ÷ (L yang lebih gelap + 0.05). Untuk dua warna lain, terapkan rumus yang sama sendiri.

AA dan AAA adalah dua tingkat kepatuhan WCAG untuk kontras teks, dan AAA lebih ketat. Untuk teks normal, AA memerlukan 4.5 : 1 dan AAA memerlukan 7 : 1; untuk teks besar, AA memerlukan 3 : 1 dan AAA memerlukan 4.5 : 1. Alat ini menandai tiap tingkat sebagai lulus atau tidak lulus. "Teks besar" berarti 18pt (sekitar 24px) ke atas, atau teks tebal 14pt (sekitar 18.7px) ke atas. Untuk situs web, targetnya biasanya AA.

Warna dicampurkan dulu ke latar sesuai opasitasnya, lalu kontras dihitung dari hasilnya. Baris "Latar putih" mencampurkannya di atas putih murni dan baris "Latar hitam" di atas hitam murni, jadi warna semi-transparan yang sama sebenarnya menjadi warna yang berbeda di tiap baris. Jika latar sebenarnya di halaman Anda bukan putih atau hitam murni, hasilnya akan berbeda, jadi periksa sendiri.

Tidak. Picker adalah kontrol bawaan browser dan hanya bisa memilih warna HEX 6 digit tanpa transparansi. Setelah Anda memilih warna dengannya, kotak input diganti dengan #rrggbb dan opasitas sebelumnya hilang; untuk warna semi-transparan, ketik HEX 8 digit atau rgb(255 0 0 / 50%) langsung di kotak input. Jika kotak input berisi warna semi-transparan, picker hanya menampilkan bagian opaknya.

Salin lalu letakkan di aturan :root, dan siap dipakai. Keempat barisnya adalah HEX, tiga angka R G B yang dipisahkan spasi, tiga nilai H S L, dan oklch() lengkap. --color-rgb dan --color-hsl tidak membawa opasitas, sehingga opasitas bisa diatur langsung, seperti rgb(var(--color-rgb) / 50%); sintaks spasi plus garis miring ini membutuhkan browser yang cukup baru. Jika warnanya sendiri semi-transparan, hanya --color dan --color-oklch yang menyertakan opasitas.