HSL njlentrehake warna kaya wong ngomong: hue apa, sepira kolorisé, sepira padhangé. Ngonversi kode HEX menyang HSL iku cara paling cepet kanggo ngowahi warna dadi bentuk sing bisa kowe tweak — nggawe luwih padhang, ngedhepke, utawa mbangun skala lengkap saka kono.
Carane konversi saka HEX dadi HSL
- Konversi kode HEX menyang RGB lan bagi saben channel karo 255, supaya kabeh ana ing antarane 0 lan 1.
- Goleki nilai paling gedhe lan paling cilik saka telu kasebut. Rata-ratane iku lightness L.
- Jarak antarane loro kasebut ngendhaleni saturation S: bagi karo (2 − max − min) kanggo warna padhang, utawa karo (max + min) kanggo warna peteng.
- Channel sing nduwèni nilai maksimum nemtokake hue H — abang ing 0°, ijo ing 120°, biru ing 240° — lan loro channel liyane nempatake hue ing jerone segmen kuwi.
Conto kerja
Matematika persis, nanging nilai HSL biasane dibundher menyang derajat lan persentase bulat. Ngonversi mbalèk bisa nggawe bedane siji utawa loro langkah RGB saka asline — ora katon ing praktik, nanging penting dingerteni yen kowe kerep mbalèk-walèk warna.
HEX lan HSL dijlentrehake
Apa iku HEX?
Kode HEX iku angka heksadesimal 6-digit sing nyimpen channel abang, ijo lan biru saka sawijining warna kanthi tandha # ing ngarep. Saben pasangan digit makili siji channel, saka 00 (ora ana) nganti FF (penuh), menehi jumlah warna sing padha karo RGB (16.7 yuta) ing notasi sing luwih cendhak. HEX minangka default ing CSS, piranti desain lan pandhuan merek.
- Sintaksis:
- #RRGGBB
- Rentang:
- 00–FF saben channel
- Paling cocog kanggo:
- CSS, handoff desain, pandhuan merek
Apa iku HSL?
HSL mecah warna dadi hue (0–360° ing roda warna), saturation (sepira werna, 0–100%) lan lightness (sepira padhang, 0–100%). Amarga saben bagean cocog karo cara wong njlèntrèhaké warna, HSL dadi format sing paling gampang kanggo nggawe tint, shade lan palet sing konsisten — kanthi manual utawa ing kode.
- Sintaksis:
- hsl(H, S%, L%)
- Rentang:
- 0–360°, 0–100%, 0–100%
- Paling cocog kanggo:
- palet, tint lan shade, theming
Tabel referensi saka HEX menyang HSL
Werna CSS sing paling umum, dikonversi saka HEX menyang HSL.
| Warna | HEX | HSL |
|---|---|---|
| black | #000000 | hsl(0, 0%, 0%) |
| white | #FFFFFF | hsl(0, 0%, 100%) |
| red | #FF0000 | hsl(0, 100%, 50%) |
| lime | #00FF00 | hsl(120, 100%, 50%) |
| blue | #0000FF | hsl(240, 100%, 50%) |
| yellow | #FFFF00 | hsl(60, 100%, 50%) |
| orange | #FFA500 | hsl(39, 100%, 50%) |
| teal | #008080 | hsl(180, 100%, 25%) |
| purple | #800080 | hsl(300, 100%, 25%) |
| gray | #808080 | hsl(0, 0%, 50%) |