Tiada muat naik, 100% setempat, tiada akaun

Penukar Warna

Tukar antara HEX, RGB, HSL, HSV dan CMYK. Pratonton langsung. Penyemak kontras WCAG untuk kebolehcapaian. Tiada apa meninggalkan pelayar anda.

Cara Penukar Warna berfungsi

Color Converter menterjemahkan mana-mana warna antara format HEX, RGB, HSL, HSV, dan CMYK serta-merta semasa anda menaip. Ia juga menjalankan semakan kontras WCAG antara mana-mana dua warna yang anda pilih, menunjukkan nisbah kontras dan keputusan lulus/gagal AA/AAA untuk teks biasa, teks besar, dan komponen UI. Semua pengiraan berlaku dalam pelayar tanpa data yang dihantar ke mana-mana; tiada apa yang anda taip meninggalkan peranti anda.

Memahami bagaimana warna yang sama kelihatan merentasi model warna berguna dalam serah terima reka bentuk. Seorang pereka mungkin menetapkan warna jenama sebagai HEX #1A4F8C; pembangun CSS memerlukan setara HSL untuk tema; pasukan cetak memerlukan pecahan CMYK. Alat ini melakukan penukaran dalam semua arah sekaligus supaya anda tidak perlu menjalankan beberapa penukar berasingan.

Cara menggunakan Penukar Warna, langkah demi langkah

  1. Taip nilai HEX, klik swotch warna, atau masukkan nilai RGB, HSL, HSV, atau CMYK ke dalam medan masing-masing.
  2. Semua perwakilan format lain dikemas kini serta-merta untuk menunjukkan warna yang setara.
  3. Untuk menjalankan semakan kontras, pilih warna latar depan dan warna latar belakang menggunakan dua pemilih warna.
  4. Baca nisbah kontras WCAG dan lencana lulus/gagal untuk tahap pematuhan AA dan AAA.
  5. Salin mana-mana nilai warna menggunakan ikon salin di sebelah setiap medan.

Kes penggunaan biasa

  • Pereka UI menukar kod HEX jenama kepada HSL untuk menulis sifat tersuai CSS untuk sistem tema.
  • Pembangun web menyemak nisbah kontras antara warna teks dan latar belakang mereka sebelum menghantar komponen untuk mengesahkan pematuhan WCAG AA.
  • Pereka cetak menerima warna HEX web dan memerlukan setara CMYK untuk memadankannya dalam brosur yang dicetak.
  • Pembangun memerlukan pecahan RGB token reka bentuk untuk menghantar nilai saluran individu ke fungsi lukisan canvas.

Soalan lazim

Adakah alat ini menyokong nilai alfa (ketelusan)?

Penukar semasa berfungsi dengan warna yang sepenuhnya legap (alfa = 1). HEXA (hex 8 digit) dan RGBA belum dalam skop. Untuk kelegapan, tetapkan saluran alfa dalam CSS anda secara berasingan menggunakan notasi rgba() atau oklch().

Adakah warna yang saya masukkan disimpan atau dihantar ke mana-mana?

Tidak. Penukaran warna adalah aritmetik tulen (pemetaan semula saluran dan pengskalaan julat) yang berjalan sepenuhnya dalam enjin JavaScript pelayar. Tiada apa yang anda taip di sini mencapai mana-mana pelayan atau perkhidmatan luaran.

Tahap kontras WCAG mana yang disokong oleh pemeriksa?

Alat ini melaporkan terhadap kriteria kejayaan WCAG 2.1: AA memerlukan nisbah kontras minimum 4.5:1 untuk teks biasa (di bawah 18pt atau 14pt tebal) dan 3:1 untuk teks besar dan komponen UI. AAA memerlukan 7:1 untuk teks biasa dan 4.5:1 untuk teks besar.

Mengapa nilai CMYK berbeza antara alat ini dan perisian reka bentuk profesional?

Penukaran RGB ke CMYK yang dilakukan oleh alat ini adalah formula matematik tanpa profil warna. Aplikasi reka bentuk profesional menggunakan profil warna ICC yang mengambil kira keuntungan titik dakwat dan sifat substrat. Nilai CMYK di sini berguna untuk anggaran; untuk cetakan pengeluaran, sentiasa gunakan profil akhbar anda dalam perisian khusus.

Bolehkah saya menukar nama warna CSS seperti 'cornflowerblue' di sini?

Nama warna CSS tidak ditaip terus ke dalam medan penukar. Untuk menukar warna bernama, pertama cari nilai HEX-nya dalam rujukan CSS (cornflowerblue adalah #6495ED), kemudian tampal HEX tersebut ke dalam medan HEX untuk melihat semua format lain.

Adakah alat ini berfungsi tanpa talian selepas halaman dimuatkan?

Ya. Penukaran warna adalah aritmetik tanpa kebergantungan luaran. Setelah halaman berada dalam cache pelayar anda, anda boleh membukanya tanpa sambungan rangkaian dan semua penukaran akan berfungsi seperti biasa.