Konversi HSL menyang HEX: Pandhuan Lengkap
Kaca iki minangka alat daring gratis sing ngowahi warna HSL (Hue, Saturation, Lightness) dadi kode hexadecimal (HEX). Sampeyan mung kudu ngetik angka hue (0–360), saturasi (0–100%), lan lightnes (0–100%), banjur alat iki langsung nuduhake kode HEX sing cocog, kayata #1E90FF. Kabeh pangolahan ana ing browser sampeyan dhewe, ora ana data sing dikirim menyang server.
Cara Kerja Kaca Iki
Kaca iki dirancang kanggo mbantu para desainer lan pangembang ngowahi warna saka model HSL sing gampang diresiki dadi format HEX sing universal digunakake ing CSS, HTML, lan piranti desain. Nalika sampeyan ngetik utawa milih warna liwat kontrol input, nilai HEX langsung dianyari. Ora mung HEX, kabeh lapangan warna liyane kaya RGB, HSV, CMYK, lan LAB uga dianyari bebarengan. Iki migunani banget nalika sampeyan kudu mbandhingake warna ing macem-macem format.
Rincian Input
Sampeyan kudu nyedhiakake telung nilai:
- Hue (Werna): angka antarane 0 lan 360. Iki nggambarake posisi ing roda warna.
- Saturation (Saturasi): persentase saka 0% (abu-abu) nganti 100% (warna murni).
- Lightness (Kecerahan): persentase saka 0% (ireng) nganti 100% (putih).
Conto input sing bener: 243, 75%, 59%. Yen sampeyan salah ngetik, umpamane tanpa tanda persen, alat bakal nuduhake pesen kesalahan: "Enter HSL as hue 0–360 with two percentages, like 243, 75%, 59%."
Rincian Output
Output utama yaiku kode HEX enem digit (kayata #4f46e5). Yen saben saluran RGB bisa diwakili dening siji digit heksadesimal, alat uga bakal nuduhake wangun singkok telung digit (kayata #abc). Kode HEX ora duwe saluran alpha, kajaba nggunakake wangun wolung digit sing ora diwenehake ing kaca iki.
Bedane Kaca Iki karo Alat Liyane
Apa sing ndadekake kaca iki béda? Akeh alat konversi warna mung nyedhiyakake konversi langsung tanpa nerangake konteks. Nanging, kaca iki dikhususake kanggo HSL menyang HEX, yaiku konversi sing langsung lan tanpa mundhut (lossless) ing jangkoan sRGB. HSL minangka model warna sing dirancang kanggo nalar manungsa babagan warna — ngganti lightness mung njaga hue, mula digunakake kanggo generasi palet lan tema. HEX, ing sisih liya, minangka notasi RGB enem digit (utawa telung digit singkok) sing ora duwe alpha.
Konversi iki ora mbutuhake penyesuaian warna sing metu saka gamut, kaya konversi menyang LAB utawa CMYK. Iki gampang lan cepet, cocok kanggo desainer sing kudu ngekspor palet HSL menyang CSS.
Aturan lan Kasus Khusus
Alat iki nduweni sawetara aturan sing kudu dingerteni:
- Nganyari Instan: Yen sampeyan ngganti salah siji lapangan, kabeh lapangan liyane langsung dianyari. Ora perlu klik tombol.
- Validasi Input: Yen nilai hue metu saka 0–360, saturasi utawa lightness metu saka 0–100%, utawa ora diformat kanthi bener, alat bakal nuduhake pesen kesalahan. Pesen iki nggambarake format sing bener.
- Ora Ana Gamut Clipping: Konversi HSL menyang HEX tansah tetep ing jangkoan RGB sing katon. Ora ana panyesuaian warna sing metu saka gamut amarga konversi iki langsung.
- Output CMYK: Nilai CMYK sing ditampilake minangka estimasi layar lan bisa beda karo nilai cetak profesional. Iki mung kanggo referensi, dudu kanggo output cetak presisi.
- Pemrosesan Lokal: Kabeh pangolahan ditindakake ing browser sampeyan. Ora ana data sing dikirim menyang server, dadi privasi sampeyan terjaga.
Kesalahan Umum sing Kudu Dihindari
- Lali nulis tanda
%ing saturasi utawa lightness. Contoh: ngetik75tanpa%bakal dianggep salah. - Nulis hue ing njaba 0–360, kayata
400. Alat ora bakal nampa iki. - Nggunakake koma utawa spasi sing salah. Format sing bener:
hue, saturasi%, lightness%. Conto:200, 50%, 70%.
Sapa Sing Mbutuhake Kaca Iki
Kaca iki migunani kanggo sawetara kelompok:
- Desainer sing mbangun palet warna ing HSL lan butuh kode HEX kanggo implementasi ing kode utawa piranti desain kaya Figma, Sketch, utawa Adobe XD. Kanthi nggunakake HSL, dheweke bisa ngontrol kecerahan tanpa ngganti hue, sing migunani kanggo nggawe variasi warna.
- Pangembang front-end sing nampa nilai HSL saka file desain lan kudu nerjemahake menyang properti CSS HEX. Contone, yen desainer menehi
hsl(243, 75%, 59%), pangembang bisa ngowahi dadi#4f46e5kanthi cepet. - Sapa wae sing nyetel tema utawa ngetrapake rasio kontras aksesibilitas kanthi ngowahi lightness ing HSL, banjur ngowahi asile dadi nilai HEX kanggo produksi. Model HSL ndadekake gampang kanggo ngontrol kontras miturut WCAG.
Latar Belakang Teknis: Cara Konversi HSL menyang HEX
Konversi iki adhedhasar algoritma standar. HSL pisanan diowahi dadi RGB, banjur RGB diowahi dadi HEX. Rumus konversi HSL menyang RGB wis ditemtokake dening standar CSS. Ing ringkesan:
- Yen saturasi 0%, warna werna abu-abu: nilai RGB kabeh padha karo lightness.
- Yen saturasi > 0%, ngetung nilai sementara gumantung hue, banjur nemtokake saluran R, G, B kanthi matématika.
Sawise nilai RGB dipikolehi (saben ing rentang 0–255), saben angka diowahi dadi heksadesimal loro digit. Contone, RGB (79, 70, 229) dadi #4F46E5. Yen saben digit bisa diwakili siji digit heksadesimal (kayata #ABCDEF dadi #ABC yen saben pasangan digit padha), alat nuduhake wangun singkok.
Ora kaya konversi sing nglibatake ruang warna sing gumantung piranti (kaya CMYK), HSL menyang HEX tetep ing sRGB, dadi ora ana masalah gamut clipping. Iki minangka konversi sing langsung lan matematis.
FAQ
1. Kepiye yen aku ngetik hue 360? Apa warna bakal padha karo hue 0? Ya, hue 360° padha karo 0° (abang). Alat iki bisa nampa hue 360, nanging dianjurake nggunakake 0 kanggo konsistensi.
2. Apa kode HEX telung digit bisa digunakake ing CSS?
Bisa, yen saben pasangan digit RGB padha, kaya #aabbcc bisa disingkat dadi #abc. Browser modern ndhukung iki. Alat bakal nuduhake loro wangun yen cocog.
3. Apa alat iki ndhukung warna alpha (kaya HSLA utawa HEX wolung digit)?
Ora. Alat iki khusus kanggo HSL tanpa alpha. Yen sampeyan butuh alpha, kudu nambah manual ing CSS (kayata rgba() utawa #RRGGBBAA).
4. Napa nilai CMYK ing alat iki beda karo cetakan profesional? Amarga konversi CMYK ing layar minangka estimasi adhedhasar profil sRGB. Cetakan profesional nggunakake profil warna tartamtu, mesin, lan kertas sing beda. Mula, aja ngandelake nilai iki kanggo output cetak.
5. Apa data sing diketik bakal disimpen? Ora. Kabeh pangolahan ditindakake ing browser sampeyan. Ora ana data sing dikirim menyang server utawa disimpen. Privasi sampeyan tetep.
6. Napa kaca iki ora ndhukung ngetik kode HEX langsung? Kaca iki khusus kanggo konversi HSL menyang HEX. Yen sampeyan butuh konversi saka HEX menyang HSL, alat liyane ing situs iki bisa nyedhiyakake. Nanging, kaca iki dikhususake kanggo ngowahi HSL dadi HEX kanthi cepet.
Kanthi alat iki, sampeyan bisa ngowahi warna HSL dadi HEX kanthi gampang lan cepet, tanpa kuwatir babagan rumus sing rumit. Gunakake kanggo ngisi palet, ngecek kontras, utawa mung sinau hubungan antarane model warna. Kabeh ana ing browser sampeyan, siap digunakake kapan wae.