Bagaimana saya menukar warna HEX kepada RGB dan HSL?

Taip atau tampal warna ke dalam Input warna, contohnya #14b8a6, atau gunakan pemilih warna. Alat ini menunjukkan nilai HEX, rgb(), hsl(), hsv() dan cmyk(), serta oklch(), lab() dan lch(), masing-masing dengan butang Salin.

Format warna manakah yang boleh saya taip?

HEX dengan 3, 4, 6 atau 8 digit, rgb() atau rgba(), hsl() atau hsla() dalam sintaks koma atau ruang, dan tiga nombor sahaja. Jika input tidak dikenali, alat menunjukkan ralat penghuraian.

Bolehkah saya menukar warna dengan kelutsinaran?

Ya. Gunakan kawalan Kelegapan atau masukkan nilai alfa dalam input. Output kemudian merangkumi saluran alfa, seperti HEX 8 digit, rgba(), atau alfa bergaris condong dalam sintaks moden.

Adakah nilai CMYK tepat untuk percetakan?

Tidak, ia ialah anggaran piawai sRGB kepada CMYK, ditunjukkan di bawah Untuk cetakan. Untuk warna cetakan yang tepat, gunakan profil warna pencetak anda atau minta bukti cetakan, kerana warna skrin yang terang sering dicetak lebih pudar.

Bagaimana saya menyemak sama ada warna saya mempunyai kontras yang mencukupi untuk teks?

Lihat bahagian Kontras WCAG. Ia menunjukkan nisbah kontras warna anda pada putih dan hitam, digredkan AAA, AA, AA Large atau Fail. Skala Kecerahan menawarkan warna lebih cerah atau lebih gelap untuk dicuba.

Adakah ia benar-benar percuma?

Ya. Setiap alat adalah percuma untuk digunakan, tanpa akaun dan tanpa kad kredit. Kerja dijalankan pada peranti anda dan bukannya pada pelayan kami, itulah yang menjadikannya percuma untuk dijalankan.

Adakah ia berfungsi pada peranti mudah alih?

Ya. Ia berjalan dalam pelayar mudah alih semasa di iOS dan Android, tanpa apa-apa untuk dipasang.

🎨

Penukar Warna percuma

Tukar warna antara format HEX, RGB, HSL, HSV, dan CMYK dengan segera. Termasuk skala kecerahan dan swotch pratetap.

Berjalan dalam pelayar andaTiada daftar, tiada tetingkap timbulTiada log masuk diperlukanPercuma selama-lamanya

Berfungsi luar talian selepas dimuatkan

Tukar warna antara HEX, RGB, HSL, HSV dan CMYK — dengan pratonton langsung dan salinan satu sentuhan. Semuanya berjalan di pelayar anda.

Input warna

Menerima: HEX (#fff atau #ffffff), RGB (255, 255, 255) atau HSL (360, 100%, 50%)

Kelegapan100%

Pratetapan:

HEX#14B8A6

rgb() · warisanrgb(20, 184, 166)

rgb() · modenrgb(20 184 166)

hsl() · warisanhsl(173, 80%, 40%)

hsl() · modenhsl(173 80% 40%)

oklch()oklch(70.4% 0.123 182.5)

lab()lab(67.1% -42.9 -2.3)

lch()lch(67.1% 43.0 183.1)

hsv()hsv(173, 89%, 72%)

cmyk()cmyk(89%, 0%, 10%, 28%)

Nilai RGB20, 184, 166

Kontras WCAG

Pada latar belakang putih

2.49:1

Gagal

Pada latar belakang hitam

8.44:1

AAA

🖨️ Untuk cetakan: Nilai CMYK ini (89%, 0%, 10%, 28%) adalah penghampiran sRGB→CMYK piawai untuk rujukan. Untuk warna cetak yang tepat, gunakan profil ICC pencetak anda atau bukti cetakan — CMYK skrin tidak dapat memadankan setiap tinta/kertas.

Skala kecerahan

Klik mana-mana swotch untuk beralih ke warna itu

Kegunaan biasa

Konversi Warna untuk Desain WebDapatkan nilai HEX, RGB, dan HSL untuk warna apa pun - siap untuk ditempel ke CSS atau Tailwind.
Konversi Warna untuk Cetak (CMYK)Konversi warna layar (HEX/RGB) ke nilai CMYK untuk digunakan dalam desain cetak dan pencetakan profesional.
Buat Palet Warna untuk Sistem DesainKonversi warna merek di semua format dan hasilkan skala kecerahan yang konsisten untuk sistem desain lengkap.
Semak Kontras Warna untuk AksesibilitiTukar warna untuk mendapatkan nilai RGB untuk digunakan dalam alat nisbah kontras — pematuhan WCAG untuk reka bentuk yang boleh diakses.
Tukar Warna untuk FigmaDapatkan nilai HEX dan RGB yang tepat untuk ditampal ke pemilih warna Figma dan sistem token reka bentuk.

Cara ia berfungsi

Semua logik penukaran ialah JavaScript tulisan tangan berjalan sepenuhnya dalam pelayar anda — tiada pustaka, tiada panggilan pelayan. Alat ini menghurai input anda, melaluinya melalui rantaian fungsi matematik tulen, dan serentak menghasilkan sebelas format output termasuk ruang CSS Color 4 moden oklch() dan lab().

1
Penghuraian input fleksibel
Penghurai tersuai menerima heks (3, 4, 6, atau 8 digit), rgb()/rgba(), hsl()/hsla() dalam kedua-dua sintaks koma warisan dan sintaks ruang moden, dan tiga-serangkai berangka telanjang. Nilai alfa sebagai perpuluhan atau peratusan dinormalisasi kepada julat 0–1 sebelum sebarang penukaran bermula.
2
RGB sebagai hab penukaran
Setiap format yang diterima diselesaikan dahulu kepada tiga-serangkai RGB kanonik. Daripada perwakilan tunggal itu alat ini berpisah keluar: HSL dan HSV menggunakan formula min/max/kroma standard; CMYK diperoleh dengan mencari saluran kunci; dan linearisasi sRGB (lengkung gamma sekeping-sekeping ditakrifkan dalam IEC 61966-2-1) dikenakan sebelum pengiraan ruang-persepsi.
3
Ruang warna persepsi dikira dari awal
oklch() dikira menggunakan matriks rujukan 3×3 Björn Ottosson (ruang punca-kubus LMS). lab() dan lch() menggunakan adaptasi kromatik Bradford untuk menukar daripada titik putih D65 kepada D50, sepadan dengan cara CSS Color 4 mentakrifkan lab(). Ini formula sama digunakan dalam enjin pemaparan pelayar — dilaksanakan di sini tanpa sebarang kebergantungan luaran.
4
Kontras WCAG dan skala kecerahan
Keluminan relatif dikira mengikut formula WCAG 2.1 (R, G, B dilinearkan dipemberat 0.2126/0.7152/0.0722) dan nisbah kontras terhadap putih dan hitam digredkan AA-besar, AA, AAA, atau Gagal. Jalur sembilan-langkah kecerahan dijana dengan melangkah saluran kecerahan HSL dari 10% hingga 90%, membolehkan anda klik mana-mana contoh warna untuk menukar bidang warna itu.

Alat berkaitan

🎨

Pemilih Warna & Penjana Palet

Pilih warna, tukar antara HEX/RGB/HSL dan jana palet yang harmoni.

Cuba

🎨

Penjana Warna Rawak

Hasilkan warna rawak satu demi satu atau sebagai palet lima warna, kunci yang anda suka, salin nilai HEX, RGB atau HSL dan eksport palet sebagai PNG atau CSS.

Cuba

🎨

Penjana Palet Warna

Jana palet warna komplementari, analog, triadik, dan monokromatik daripada mana-mana warna asas. Salin kod hex dalam satu klik.

Cuba

Penukar Warna percuma

Kegunaan biasa

Cara ia berfungsi

Alat berkaitan

Pemilih Warna & Penjana Palet

Penjana Warna Rawak

Penjana Palet Warna

Soalan lazim