HSL to RGB converter

Badili rangi yoyote ya HSL kuwa RGB — papo hapo na bure

#F39C12

Bandika thamani yoyote ya rangi — tunagundua muundo kwako.

H
S
L
matokeo ya RGB
Nyekundu
243
Kijani
156
Bluu
18

Rangi hii katika fomati zote

Profaili ya CMYK: Coated FOGRA39 (chaguo-msingi la Photoshop kwa Ulaya)

HSL ni njia rafiki ya kuchagua rangi, RGB ndicho skrini, API za canvas na msimbo wa picha zinavyokula. Mbadalishaji huyu hubadilisha hue, saturation na lightness kuwa chaneli halisi za 0–255.

Jinsi uongozaji wa HSL hadi RGB unavyofanya kazi

  1. Badilisha S na L kuwa sehemu (fractions) na hesabu chroma C = (1 − |2L − 1|) × S.
  2. Gawanya hue kwa 60 kupata sekimenti yake kwenye gurudumu la rangi na hesabu thamani ya kati X = C × (1 − |(H/60 mod 2) − 1|).
  3. Weka C, X na 0 kwenye nafasi za R, G na B kulingana na sekimenti hiyo.
  4. Ongeza kipengele cha lightness L − C/2 kwenye chaneli zote tatu kisha ziongeze kwa 255.

Mfano uliofanya kazi

HSL hsl(37, 90%, 51%)=RGB rgb(243, 156, 18)

Matokeo ni sahihi hadi hatua ya mwisho ya kuzungusha hadi chaneli kamili. Thamani za fractional kwa hue au saturation zinaungwa mkono na zitapangwa kwenye triple ya RGB iliyo karibu zaidi.

HSL na RGB obofye

Ni nini HSL?

HSL inaigawanya rangi katika hue (0–360° kwenye gurudumu la rangi), saturation (ukali wa rangi, 0–100%) na lightness (uwazi/angaza, 0–100%). Kwa kuwa kila sehemu inafanana na jinsi watu wanavyotoa sifa za rangi, HSL ni muundo rahisi zaidi kwa kujenga tints, shades na paleti zenye muendelezo — kwa mkono au kwa code.

Sintaksia:
hsl(H, S%, L%)
Wigo:
0–360°, 0–100%, 0–100%
Bora kwa:
paleti, tints na shades, theming

Ni nini RGB?

RGB inaelezea rangi kama channel tatu za mwanga — red, green na blue — kila moja kutoka 0 hadi 255. Inaakisi jinsi skrini zinavyofanya kazi kwa kweli: zote tatu kwa 255 zinaipa nyeupe, zote kwa 0 zinaipa nyeusi. RGB ni chaguo sahihi wakati unahitaji kufanya hesabu na rangi, na rgba() inaongeza uwazi juu yake.

Sintaksia:
rgb(R, G, B)
Wigo:
0–255 kwa kila channel
Bora kwa:
code, canvas, uwazi na rgba()

HSL to RGB reference table

Rangi za CSS zinazotumika zaidi, zimetumika kutoka HSL hadi RGB.

RangiHSLRGB
blackhsl(0, 0%, 0%)rgb(0, 0, 0)
whitehsl(0, 0%, 100%)rgb(255, 255, 255)
redhsl(0, 100%, 50%)rgb(255, 0, 0)
limehsl(120, 100%, 50%)rgb(0, 255, 0)
bluehsl(240, 100%, 50%)rgb(0, 0, 255)
yellowhsl(60, 100%, 50%)rgb(255, 255, 0)
orangehsl(39, 100%, 50%)rgb(255, 166, 0)
tealhsl(180, 100%, 25%)rgb(0, 127, 128)
purplehsl(300, 100%, 25%)rgb(128, 0, 127)
grayhsl(0, 0%, 50%)rgb(128, 128, 128)

Maswali yanayoulizwa mara kwa mara

Badilisha S na L kuwa sehemu (fractions) na hesabu chroma C = (1 − |2L − 1|) × S. Gawanya hue kwa 60 kupata sekimenti yake kwenye gurudumu la rangi na hesabu thamani ya kati X = C × (1 − |(H/60 mod 2) − 1|). Weka C, X na 0 kwenye nafasi za R, G na B kulingana na sekimenti hiyo. Ongeza kipengele cha lightness L − C/2 kwenye chaneli zote tatu kisha ziongeze kwa 255.

Matokeo ni sahihi hadi hatua ya mwisho ya kuzungusha hadi chaneli kamili. Thamani za fractional kwa hue au saturation zinaungwa mkono na zitapangwa kwenye triple ya RGB iliyo karibu zaidi.

RGB inaelezea rangi kama channel tatu za mwanga — red, green na blue — kila moja kutoka 0 hadi 255. Inaakisi jinsi skrini zinavyofanya kazi kwa kweli: zote tatu kwa 255 zinaipa nyeupe, zote kwa 0 zinaipa nyeusi. RGB ni chaguo sahihi wakati unahitaji kufanya hesabu na rangi, na rgba() inaongeza uwazi juu yake.

Ndiyo. Kitufe cha kubadilisha upande wa kuingiza kinakuletea konveta ya RGB kwenda HSL, ambayo inafanya kazi kwa njia ile ile. Pande zote mbili zinatumia fomula ile ile, tu kwa kutumia mchakato uliorejeshwa.

Unazalisha paleti kwa msimbo? Pitia hue kwa HSL na badilisha kila hatua kuwa RGB — utapokea rangi zenye nafasi sawa ambazo hakuna urekebishaji wa RGB kwa mkono utakaozifikia.