HSL ئادەملەر رەڭنى سۆزلەيدىكەنكىدە ئىشلىتىدىغان تەرەپلەرنى بىلدۈرىدۇ: قايسى بويۇق، قانچىلىك رەڭلىك، قانچىلىك يورۇقلۇق. HEX كودىنى HSL غا ئايلاندۇرۇش — رەڭنى ئىشلىتىشكە قولاي بولغان فورماتقا كەلتۈرۈشنىڭ ئەڭ تېز ئۇسۇلى: يورۇتۇپ، ساقىتىپ ياكى ئۇنىڭدىن سەككىزلىگەن پەللىلەر قۇرغىلى بولىدۇ.
HEX دىن HSL غا ئايلاندۇرۇش قانداق ئىشلەيدۇ
- HEX كودىنى RGB غا ئايلاندۇرۇپ ھەر بىر چانالنى 255 غا بۆل، شۇنداق قىلىپ ئۇلارنىڭ ھەممىسى 0 بىلەن 1 ئارىلىقىدا بولىدۇ.
- ئۇچ قىممەتتىن ئەڭ چوڭ ۋە ئەڭ كىچىكنى تاپ. ئۇلارنىڭ ئوتتۇرىسى L (يۇمشاقلىق/lightness) بولىدۇ.
- ئۇلار ئارىسىدىكى تارقىلىش S (saturation) نى بەلگىلەيدۇ: يورۇقلۇق رەڭلىرى ئۈچۈن (2 − max − min) گە بۆل، قارا رەڭلەر ئۈچۈن (max + min) غا بۆل.
- ئەڭ چوڭ چانال قaysi بولسا ئۇ ھۇيىنى H (hue) نى قارارلايدۇ — قىزىل 0°, يېشىل 120°, كۆك 240° — ۋە قالغان ئىككى چانال ھۇيىنى ئۇ سېگمېنت ئىچىدە ئورۇنلاشتۇرىدۇ.
ئىشلىگەن مىسال
ماتېماتىكا ئېنىق، ئەمما HSL قىممەتلىرى ئادەتتە بۈتۈن دەرىجىلەر ۋە پىرسېنتلارغا ياقىنلاشتۇرۇلۇپ كۆرستىلىدۇ. قايتا ئايلاندۇرۇش نەتىجىسىدە RGB دا بىر-ئىككى قەدەمغا ئايرىلىپ قالىشى مۇمكىن — ئەمەلىيەتتە كۆزگە تۇيۇلمايدىغان، ئەمما رەڭلەرنى قايتا-قايتا ئايلاندۇرغاندا بىلىپ قويۇش لازىم.
HEX ۋە HSL چۈشەندۈرۈلدى
HEX نېمە؟
HEX كودى ئالتە ھېكسادېسىمال ساندا مۇندەرىجە بولۇپ، باشلىغۇچى # ئارقىلىق رەڭنىڭ قىزىل، يېشىل ۋە كۆك كانالىنى ساقلايدۇ. ھەر بىر جۈپ سان بىر كانالنى كۆرسىتىدۇ، 00 (يوق) دىن FF (تۇلۇق) غىچە — بۇ RGB بىلەن ئوخشاش 16.7 مىليون رەڭنى قىسقاراق ئىپادىلەيدۇ. HEX CSS، لايىھە قوراللىرى ۋە ماركا كۆرسەتكۈچلىرىدە ئادەتتىكى تاللاش.
- سٶزلەپ ئېيتقاندا:
- #RRGGBB
- ئارىلىقى:
- ھەر بىر كانال ئۈچۈن 00–FF
- ئەڭ ياخشى قوللىنىلىدىغان جايى:
- CSS، لايىھە تاپشۇرۇش، ماركا كۆرسەتكۈچلىرى
HSL نېمە؟
HSL رەڭنى بۇرۇن (ھىيۇ، رنگ چۈشتە 0–360°)، تويالاش (نېچەچە رەڭلىك، 0–100%) ۋە يورۇقلۇق (قانچىلىك يورۇق، 0–100%) غا ئايرىدۇ. ھەر بىر قىسم ئادەملەر رەڭنى تەسۋىرلەش ئۇسۇلىغا ماس كېلىدىغانلىقىدىن HSL تونۇش، سۈندۈرمە ۋە مۇۋاپىق پايلەتلارنى قولدا ياكى كودتا قۇرۇشتىكى ئەڭ ئاسان فورمات.
- سٶزلەپ ئېيتقاندا:
- hsl(H, S%, L%)
- ئارىلىقى:
- 0–360°, 0–100%, 0–100%
- ئەڭ ياخشى قوللىنىلىدىغان جايى:
- پايلەتلار، تونۇش ۋە سۈندۈرمىلەر، تېما
HEX دىن HSL غا ئىشارەت جەدۋىلى
HEX دىن HSL غا ئايلاندۇرۇلغان ئەڭ كۆپ قوللىنىلىدىغان CSS رەڭلىرى.
| رەڭ | 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%) |