HSL yana bayyana launi yadda mutane ke magana akai: wane hue, yadda launi yake da ƙarfi (saturation), da kuma haske (lightness). Maida lambar HEX zuwa HSL shine hanya mafi sauri don samun launi cikin tsarin da zaka iya gyarawa — haskaka shi, sassauta shi, ko ƙirƙirar sikeli daga gare shi.
Yadda sauyin HEX zuwa HSL ke aiki
- Canza lamban HEX zuwa RGB ka raba kowace tashar da 255, don dukkansu su kasance tsakanin 0 da 1.
- Nemo mafi girma da mafi ƙanƙanci daga cikin ƙimar ukun. Matsakaitan su shine lightness L.
- Bambancin dake tsakanin su yana ƙayyade saturation S: raba shi da (2 − max − min) don launuka masu haske, ko da (max + min) don duhu.
- Tashar da ke riƙe mafi girman ƙima ce ke yanke shawarar hue H — ja a 0°, kore a 120°, shuɗi a 240° — kuma sauran tashoshi biyu suna matsar da hue a cikin wannan sashin.
Misali da ya yi aiki
Lissafi daidai ne, amma ƙimomin HSL ana yawan zagayawa zuwa digiri cikakku da kashi cikin dari. Maida baya zai iya sa a rika ɗaukar mataki ɗaya ko biyu a RGB daga asali — ba za a gani a aikace ba, amma yana da kyau a sani idan kana zagayawa da launuka akai-akai.
HEX da HSL an bayyana su
Menene HEX?
Lambar HEX tana da hexadecimal mai haruffa shida da ke adana tashoshin ja, kore da shuɗi na launi bayan #. Kowanne ma'aurata na lambobi yana wakiltar tashar guda, daga 00 (babu) zuwa FF (cikakke), wanda ke bada irin waɗannan launuka miliyan 16.7 kamar RGB amma a gajeren rubutu. HEX shine tsohuwar zabin a CSS, kayan aikin zane da ƙa'idodin alama.
- Sintaks:
- #RRGGBB
- Iyakance:
- 00–FF per channel
- Mafi kyau don:
- CSS, miƙa aikin zane, ƙa'idodin alama
Menene HSL?
HSL yana raba launi zuwa hue (0–360° a kan ƙwallon launi), saturation (yadda yake da launi, 0–100%) da lightness (yadda yake haske, 0–100%). Saboda kowace ɓangare ta dace da yadda mutane ke bayyana launi, HSL shine tsarin da ya fi sauƙi don gina tints, shades da palet masu daidaito — da hannu ko a cikin lambar.
- Sintaks:
- hsl(H, S%, L%)
- Iyakance:
- 0–360°, 0–100%, 0–100%
- Mafi kyau don:
- palettes, tints da shades, theming
teburin tunani na HEX zuwa HSL
Mafi yawan launukan CSS, an sauya daga HEX zuwa HSL.
| Launi | 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%) |