Penjana Palet Warna
Warna pelengkap bagi merah #ff0000 ialah #00ffff, warna di seberangnya pada roda warna. Skema triadik merah menambah #00ff00 dan #0000ff. Hitam di atas putih mempunyai nisbah kontras 21:1.
Cara guna
- Pilih warna asas dengan kotak warna, atau taip kod HEX seperti #0b7a6a. Teks RGB dan HSL seperti rgb(11, 122, 106) juga berfungsi.
- Pilih skema: Pelengkap, Analog, Triadik atau Monokrom. Warna asas anda diberi garis tepi.
- Klik baris HEX, RGB atau HSL untuk menyalin nilai itu, atau tekan Salin semua HEX untuk seluruh palet.
- Semak dua baris kontras pada setiap petak warna. Ia menunjukkan sejauh mana teks putih dan teks hitam boleh dibaca pada warna itu.
Cara kiraan
Warna dikendalikan dalam HSL: rona ialah kedudukan pada roda warna dari 0 hingga 360 darjah, ketepuan ialah betapa pekatnya warna, dan kecerahan ialah betapa cerah atau gelapnya. Skema memutarkan rona dan mengekalkan ketepuan serta kecerahan, jadi setiap warna dalam palet mempunyai rasa yang serupa.
Pelengkap menambah warna 180 darjah di seberang roda. Analog menggunakan warna jiran 30 darjah di kedua-dua sisi. Triadik menggunakan tiga warna berjarak 120 darjah. Monokrom mengekalkan rona dan ketepuan serta hanya mengubah kecerahan dalam langkah 15 mata, antara 8 dan 92 peratus supaya hujungnya tidak menjadi putih atau hitam tulen.
Nisbah kontras mengikut WCAG 2. Setiap saluran ditukar kepada cahaya linear, luminans relatif L = 0.2126 R + 0.7152 G + 0.0722 B dikira, dan nisbahnya ialah (L lebih cerah + 0.05) / (L lebih gelap + 0.05), dari 1:1 hingga 21:1.
WCAG mensyaratkan sekurang-kurangnya 4.5:1 untuk teks biasa (AA) dan 7:1 untuk AAA. Teks besar, kira-kira 24 px atau 19 px tebal ke atas, memerlukan 3:1 untuk AA. Label di bawah setiap nisbah menggunakan ambang ini untuk teks biasa, dengan AA besar ditunjukkan apabila hanya peraturan teks besar dipenuhi.
Ambang nisbah kontras
| Tahap | Nisbah | Kegunaan |
|---|---|---|
| AA besar | 3:1 | Teks besar dan bahagian antara muka pengguna |
| AA | 4.5:1 | Teks badan biasa |
| AAA | 7:1 | Kebolehbacaan dipertingkat |
Soalan lazim
Apakah warna pelengkap?
Warna yang betul-betul bertentangan dengan warna asas anda pada roda warna, 180 darjah jauhnya. Pasangan ini mempunyai kontras yang kuat, sesuai untuk butang seruan tindakan pada latar belakang.
Skema mana yang patut saya pilih untuk laman web?
Monokrom paling selamat untuk antara muka yang tenang. Analog memberi rupa yang harmoni dengan sedikit kepelbagaian. Pelengkap dan triadik lebih berani, jadi gunakan satu warna sebagai utama dan yang lain sebagai aksen kecil.
Adakah nisbah kontras yang tinggi sentiasa diperlukan?
Untuk teks, ya. Teks badan patut mencapai 4.5:1 terhadap latar belakangnya. Bentuk hiasan dan tajuk besar boleh lebih rendah, tetapi teks dalam butang dan pautan masih patut memenuhi peraturan itu.
Mengapa warna yang dijana boleh berbeza sedikit daripada warna yang saya pilih sendiri?
Warna asas anda dikekalkan tepat seperti yang dimasukkan. Warna lain dikira dalam HSL dan dibundarkan kepada nilai RGB bulat, jadi warna terbitan boleh berbeza satu langkah daripada yang dipilih dengan tangan.
Adakah ia menyimpan warna saya?
Tidak. Semuanya dikira dalam pelayar anda. Gunakan Pautan kongsi untuk menyimpan warna asas dan skema anda dalam URL.