#00FA9A · Penjana & Pemilih Kod Warna

Jana kod warna, variasi, harmoni, dan semak nisbah kontras.

Penukaran Warna

#00fa9a

Variasi

Tujuan bahagian ini adalah untuk menghasilkan warna cerah (putih tulen ditambah) dan warna gelap (hitam tulen ditambah) dari warna yang anda pilih dalam kenaikan 10%.

Tip Pro: Gunakan warna gelap untuk keadaan hover dan bayang-bayang, warna cerah untuk sorotan dan latar belakang.

Warna Gelap

Variasi lebih gelap yang dihasilkan dengan menambah hitam kepada warna asas anda.

Warna Cerah

Variasi lebih cerah yang dihasilkan dengan menambah putih kepada warna asas anda.

Kes Penggunaan Biasa

  • • Keadaan komponen UI (hover, aktif, dinyahdayakan)
  • • Mewujudkan kedalaman dengan bayang-bayang dan sorotan
  • • Membina sistem warna yang konsisten

Tip Sistem Reka Bentuk

Variasi ini membentuk asas palet warna yang padu. Eksport mereka untuk mengekalkan konsistensi di seluruh projek anda.

Kombinasi Warna

Setiap harmoni mempunyai mood tersendiri. Gunakan harmoni untuk menjana idea kombinasi warna yang serasi.

Cara Menggunakan

Klik pada mana-mana warna untuk menyalin nilai hexnya. Kombinasi ini terbukti secara matematik untuk mencipta harmoni visual.

Kenapa Ia Penting

Harmoni warna mencipta keseimbangan dan membangkitkan emosi tertentu dalam reka bentuk anda.

Komplemen

Satu warna dan lawannya pada roda warna, +180 darjah hue. Kontras tinggi.

Terbaik untuk: Reka bentuk berimpak tinggi, CTA, logo

Komplemen berpecah

Satu warna dan dua yang bersebelahan dengan komplemennya, +/-30 darjah hue dari nilai bertentangan warna utama. Berani seperti komplemen lurus, tetapi lebih serba boleh.

Terbaik untuk: Susun atur yang bertenaga tetapi seimbang

Triadik

Tiga warna yang dijarakkan sama rata di sepanjang roda warna, setiap satu 120 darjah hue. Sebaiknya biarkan satu warna mendominasi dan gunakan yang lain sebagai aksen.

Terbaik untuk: Reka bentuk yang ceria dan bertenaga

Analog

Tiga warna dengan luminans dan ketepuan yang sama dengan hue yang bersebelahan pada roda warna, 30 darjah jaraknya. Peralihan yang lancar.

Terbaik untuk: Antaramuka yang diilhamkan oleh alam, menenangkan

Monokromatik

Tiga warna dengan hue yang sama dengan nilai luminans +/-50%. Halus dan terperinci.

Terbaik untuk: Reka bentuk minimalis, sofistikated

Tetradik

Dua set warna pelengkap, dipisahkan oleh 60 darjah hue.

Terbaik untuk: Skema warna yang kaya dan pelbagai

Prinsip Teori Warna

Keseimbangan

Gunakan satu warna dominan, sokong dengan warna sekunder, dan aksen secara berhemat.

Kontras

Pastikan kontras mencukupi untuk kebolehbacaan dan kebolehcapaian.

Harmoni

Warna harus bekerjasama untuk mencipta pengalaman visual yang bersatu.

Pemeriksa Kontras Warna

Uji kombinasi warna untuk memastikan ia memenuhi piawaian kebolehcapaian WCAG untuk kebolehbacaan teks.

Kontras

1.00
common.contrastFail
Sangat lemah
Teks kecil
common.contrastFail
Teks besar
common.contrastFail

Piawaian WCAG

AA:Nisbah kontras minimum 4.5:1 untuk teks biasa dan 3:1 untuk teks besar. Diperlukan untuk kebanyakan laman web.
AAA:Nisbah kontras dipertingkatkan 7:1 untuk teks biasa dan 4.5:1 untuk teks besar. Disyorkan untuk aksesibiliti optimum.
Kontras tidak mencukupi untuk semua saiz teks - tidak memenuhi piawaian WCAG.

Pemeriksa Kontras Lanjutan

Laraskan dengan slider, pelbagai pratonton & banyak lagi

Semua orang adalah Genius. Tetapi Jika Anda Menilai Seekor Ikan Berdasarkan Kemampuannya Memanjat Pokok, Ia Akan Hidup Sepanjang Hayatnya Percaya Bahawa Ia Bodoh.

contrastChecker.quote1Author

Format Teknikal

Terokai representasi ruang warna lanjutan dan model warna profesional yang digunakan dalam pengeluaran video, fotografi, aplikasi saintifik, dan sistem pengurusan warna. Format teknikal ini menyediakan spesifikasi warna yang tepat untuk industri dan aplikasi khusus.

Format Praktikal

Tukar warna kepada format praktikal untuk aplikasi dunia sebenar termasuk simulasi cetakan, paparan LED, output terminal, dan pengekodan data. Format ini membantu anda melaksanakan warna merentasi media, platform, dan peranti fizikal yang berbeza.

Analisis Warna

Analisis sifat warna dengan metrik lanjutan termasuk komposisi spektrum, ketulenan warna, kesan metamerisme, dan ciri persepsi. Alat ini memberikan pandangan mendalam tentang tingkah laku dan penampilan warna di bawah pelbagai keadaan tontonan.

Simulator Buta Warna

Periksa bagaimana warna dilihat oleh orang dengan pelbagai jenis buta warna untuk mencipta reka bentuk yang lebih mudah diakses. Memahami persepsi warna membantu memastikan kandungan anda boleh diakses oleh semua orang.

Aspek kreatif

Terokai dimensi artistik dan psikologi warna termasuk persatuan bermusim, kesan emosi, kejadian semula jadi, pigmen sejarah, dan resipi campuran warna untuk aplikasi kreatif.