Dawo da palette na bugu zuwa yanar gizo ya fi sauƙi a HSL: idan haɗin tawada ya bayyana a matsayin hue, saturation da lightness, zaka iya gina hover states, tints da shades daga gare shi cikin 'yan dakikoki.
Yadda sauyin CMYK zuwa HSL ke aiki
- Maida kashi CMYK zuwa tashoshin RGB tsakanin 0 da 255.
- Raba tashoshi da 255 ka ɗauki mafi girma da mafi ƙanƙanci.
- Matsakaicin mafi girma da mafi ƙanƙanci shine lightness L, bambancinsu yana kula da saturation S.
- Tashar da ke riƙe mafi girma tana tantance hue H a digiri a kan kibiyar launi.
Misali da ya yi aiki
Matakin CMYK zuwa RGB tuni kimantawa ne kuma ƙimomin HSL ana zagayawa zuwa lambobi cikakku. Sakamakon kusan daidai ne, ba sauyawa mai sarrafa launi ba.
CMYK da HSL an bayyana su
Menene CMYK?
CMYK shine tsarin tawada huɗu da ake amfani da shi wajen bugu: cyan, magenta, yellow da key (baki), kowane a matsayin ƙashi daga 0 zuwa 100. Tawada tana cire haske maimakon fitar da shi, saboda haka CMYK yana rufe ƙananan launuka fiye da allo — shi ya sa launukan haske na allo sau da yawa suna bayyana marasa haske bayan an buga su.
- Sintaks:
- cmyk(C%, M%, Y%, K%)
- Iyakance:
- 0–100% per ink
- Mafi kyau don:
- bugu, kunshin, aikin jarida mai shiryawa
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 CMYK zuwa HSL
Mafi yawan launukan CSS, an sauya daga CMYK zuwa HSL.
| Launi | CMYK | HSL |
|---|---|---|
| black | cmyk(0%, 0%, 0%, 100%) | hsl(0, 0%, 0%) |
| white | cmyk(0%, 0%, 0%, 0%) | hsl(0, 0%, 100%) |
| red | cmyk(0%, 100%, 100%, 0%) | hsl(0, 100%, 50%) |
| lime | cmyk(100%, 0%, 100%, 0%) | hsl(120, 100%, 50%) |
| blue | cmyk(100%, 100%, 0%, 0%) | hsl(240, 100%, 50%) |
| yellow | cmyk(0%, 0%, 100%, 0%) | hsl(60, 100%, 50%) |
| orange | cmyk(0%, 35%, 100%, 0%) | hsl(39, 100%, 50%) |
| teal | cmyk(100%, 0%, 0%, 50%) | hsl(180, 100%, 25%) |
| purple | cmyk(0%, 100%, 0%, 50%) | hsl(300, 100%, 25%) |
| gray | cmyk(0%, 0%, 0%, 50%) | hsl(0, 0%, 50%) |