HSL דערציילט אַ קאָליר ווי מענטשן רעדן וועגן זי: וועלכער הוי, ווי קאָלאָרדיק, ווי פֿאַרלײַכטערט. קאַנווערטערן אַ HEX‑קאָוד צו HSL איז די שנעלסטע וועג צו ברענגען אַ קאָליר אין אַ פאָרמע וואָס דו קענסט טוישן — ליכטיקן, דעמפּן, אָדער בויען אַ גאַנץ סקייל דערפון.
ווי אַ HEX צו HSL קאָנוועזיע אַרבעט
- מאַך די HEX‑קאָוד צו RGB און טייל יעדער כאַנעל דורך 255, אַזוי אַלע דרײַ ליגן צווישן 0 און 1.
- פֿינד דעם גרעסטן און דעם קלענסטן פֿון די דרײַ ווערטן. זייער דורכשניט איז די ליכטיקייט L.
- די שפּאַרונג צווישן זיי טריבט די סאַטוראַציע S: טייל זי דורך (2 − max − min) פֿאַר ליכטיקע קאָלירן, אָדער דורך (max + min) פֿאַר טױקע.
- דער כאַנעל וואָס האָט די מאַקסימום באַשליסט דעם הוי H — רויט בײַ 0°, גרין בײַ 120°, בלוי בײַ 240° — און די אַנדערע צוויי כאַנעלן לעבן דעם הוי אינרעכט פונעם סעגמענט.
אַרבעטנדיקער ביישפּיל
די מאַתעמאַטיק איז געניִגט, אָבער HSL ווערטן נאָרמאַלערווייז רונגעקלערט צו הײלע גראַדן און פּראָצענטן. צוריק־קאַנווערטערן קען דערפֿאָלגן צו אַ רעזולטאַט איין־צווישן אָדער צוויי RGB־שטריט פֿון אָריגינעל — נישט געזען אין פּראַקטיק, אָבער אַ גוטער זאַך צו וויסן ווען דו מאַכסט ראָונד‑טריפּ קאָלירן.
HEX און HSL דערקלערט
וואס איז HEX?
אַ HEX־קאָד איז אַ זעקס־דיציט אַרבעטן־העקסאַדעצימאַל נומער וואָס סטאָרס די רויטע, גרינע און בלויע טשאַנעלס פון אַ קאָליר אַחורי אַ פֿירער #. יעדער פּאָר דיציט דעקן איין טשאַנעל — פֿון 00 (קיין) ביז FF (פול) — וואָס געבט די זעלבע 16.7 מיליאָן קאָלירן ווי RGB אין אַ פיל קורצער נאָטאציע. 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 רעפֿערענץ טיש
די מערסט געוויינטלעך CSS קאָלירן, קאָנווערטירט פֿון HEX צו HSL.
| קאָליר | 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%) |