HSL í RGB breytir

Hvað er HSL og RGB?

HSL (Hue, Saturation, Lightness) og RGB (Red, Green, Blue) eru tvær algengar leiðir til að lýsa litum á tölvuskjáum. Munurinn á þeim liggur ekki í litunum sjálfum heldur í því hvernig þeir eru settir fram. RGB gildin segja beint til um hversu mikið rauður, grænn og blár ljósgjafi skjásins á að lýsa, hvert á bilinu 0 til 255. Þetta er tölulegt, vélrænt form sem er fullkomið fyrir skjái og CSS-kóða.

HSL var hannað fyrir mennska hugsun. Hugmyndin er að litur hafi þrenns konar eiginleika: litbrigði (hue), sem er staða á 360 gráðu litahring, mettun (saturation) sem segir til um hversu hreinn liturinn er, og ljóma (lightness) sem segir til um hversu ljós eða dökkur liturinn er, bæði gefin upp sem prósentur. Þegar þú breytir ljómanum í HSL heldur litbrigðið sér ôbreyttu. Það er ástæðan fyrir því að HSL er notað við myndun litatöflna og þema – þú getur búið til heila röð af litum sem allir deila sama litbrigði, bara með mismunandi ljóma eða mettun.

HSL-tólið á þessari síðu tekur á móti HSL-gildi, til dæmis 243, 75%, 59%, og umbreytir því samstundis í nákvæmlega RGB-gildið 79, 70, 229. Allir aðrir litagáttir sem skjárinn notar – HEX, HSV, CMYK, LAB – uppfærast líka samstundis.

Hvernig virkar umbreytingin?

Umbreytingin milli HSL og RGB er reiknilega einföld en nákvæm. Hún byggir á stöðluðum formúlum sem hafa verið í notkun í áratugi. Ferlið er taplaust: fyrir hvert gilt HSL-gildi fæst nákvæmlega eitt RGB-gildi sem er innan sýnilegs sviðs skjásins. Það er engin litaskekkja þegar umbreytt er aftur.

Reikniritið byrjar á að staðla HSL-gildin: hue er deilt með 360 til að fá gildi milli 0 og 1, og mettun og ljómi eru deild með 100. Síðan er reiknað út tímabundið gildi fyrir rauðan, grænan og bláan, og að lokum er þeim stillt inn í svið 0–255.

Það sem skiptir máli er að engin of-ramma (out-of-gamut) klipping á sér stað, ólíkt umbreytingum úr LAB eða CMYK yfir í RGB. Þegar umbreytt er úr LAB, sem nær yfir stærra litarými en RGB, geta sumir litir verið utan sviðs skjásins og þá verður að klippa þá, sem breytir litnum. HSL og RGB ná yfir nákvæmlega sama litarýmið, svo ekkert slíkt vandamál kemur upp.

Inntaks- og úttaksgildi

Tólið tekur við nákvæmlega því sniði sem HSL er oftast sett fram í:

Þegar HSL-gildið er rétt slegið inn uppfærast öll úttakssvið samstundis. Úttakið inniheldur:

• HEX – sex stafa hexadecimal gildi, til dæmis #4F46E5
• RGB – þrjár tölur á bilinu 0–255, til dæmis 79, 70, 229
• HSL – endurtekið úr inntaki
• HSV – hue, saturation, value
• CMYK – cyan, magenta, gulur, svartur
• LAB – L* (ljómi), a* (grænn-rauður ás), b* (blár-gulur ás)

Allar umbreytingar fara fram beint í vafranum þínum. Ekkert sem þú slærð inn er hlaðið upp á neinn þjón.

Athugasemd um CMYK

CMYK gildin sem birtast eru áætluð fyrir skjáinn og geta verið frábrugðin þeim gildum sem notuð eru í fagprentun. Ástæðan er sú að litur á pappír fer eftir pappírstegund, bleki og prentvél, sem öll hafa sín eigin litagátt. CMYK á skjá er alltaf áætlun, ekki nákvæm fyrirmynd.

Reglur og jaðartilvik

Ef HSL-gildið er slegið inn á rangan hátt – til dæmis ef hue-gildið er utan 0–360, eða ef mettun eða ljómi er ekki gefin upp sem prósenta – birtir tólið villuskilaboðin:

"Enter HSL as hue 0–360 with two percentages, like 243, 75%, 59%."

Þessi skilaboð koma upp strax, án þess að síðan endurhlaðist. Það er engin bið. Tólið skynjar strax hvort innsláttur sé réttur eða ekki.

Dæmi um ógild inntök:

• 360, 50%, 50% – 360 er gilt, en 359,9 er líka gilt; 0 og 360 eru sömu liturinn (rauður).
• 243, 75, 59% – mettun er ekki gefin upp sem prósenta.
• 243, 75%, 110% – ljómi er yfir 100%, sem er ógilt.
• abc, 75%, 59% – hue er ekki tala.

Ef inntakið er gilt, þá er umbreytingin tafarlaus og taparlaus. Það er engin þörf á að smella á hnapp eða staðfesta.

Hver þarf á þessu að halda?

• Hönnuðir sem vinna með litatöflur eða þemu. HSL er frábært til að hugsa um litbrigði og ljóma, en þegar kemur að kóða er RGB nauðsynlegt. Þetta tól gerir þér kleift að vinna í HSL og sjá strax RGB-gildin.
• Vefhönnuðir sem flytja litt úr hönnunarforritum (sem nota oft HSL) yfir í CSS eða annað kóðaform sem krefst RGB. Í stað þess að reikna handvirkt eða leita að töflu færðu nákvæmt gildi á nokkrum sekúndum.
• Allir sem vilja hugsa um liti á mannlegan hátt (litbrigði, mettun, ljómi) en þurfa nákvæm skjá-gildi. Þegar þú ert að stilla ljómann í HSL til að fá dekkri eða ljósari útgáfu af sama lit, geturðu séð nákvæmlega hvaða RGB-númer það samsvarar. Þetta er gagnlegt við að búa til aðgengilegar litatöflur með nægilegri andstæðu.

Algengar spurningar (FAQ)

Er umbreytingin afturkræf?
Já, umbreytingin milli HSL og RGB er taparlaus. Ef þú umbreytir HSL-gildi í RGB og síðan aftur í HSL færðu nákvæmlega sama gildið. Það er vegna þess að báðir litagáttir nota sömu nákvæmni og klipping á sér ekki stað.

Hvers vegna sýnir tólið CMYK ef það er ekki nákvæmt fyrir prentun?
CMYK gildið sem birtist er reiknað út frá RGB-litarýminu sRGB, sem er staðlað fyrir skjái. Það gefur góða vísbendingu um hvernig liturinn gæti litið út á prenti, en vegna mismunandi pappírs, bleks og prentvéla getur raunverulegt útlit verið frábrugðið. Fyrir nákvæma prentun þarf sérstaka litarstjórnun.

Get ég notað tólið með HEX-gildi í stað HSL?
Nei, þetta tól tekur eingöngu við HSL-gildi. Ef þú ert með HEX-gildi og vilt sjá RGB eða önnur gildi, þá þarftu annað tól sem tekur við HEX. Þessi síða er sérstaklega hönnuð fyrir HSL-til-RGB umbreytingu.

Hvað gerist ef ég slæ inn tugabrot?
Tugabrot eru leyfð, til dæmis 243.5, 75%, 59%. Tólið umbreytir þeim rétt, en mundu að hue-gildið verður að vera á milli 0 og 360. Mettun og ljómi verða að vera á milli 0 og 100 prósent.

Er hægt að nota tólið án nettengingar?
Já, allar umbreytingar fara fram beint í vafranum. Engin gögn eru send á netþjón. Þetta þýðir að tólið virkar án nettengingar, svo framarlega sem síðan er hlaðin í vafrann fyrst.

Af hverju fæ ég ekki nákvæmlega sömu RGB-gildi og í öðrum tólum?
Það geta verið smávægilegar tölulegar mismunir milli tóla sem nota mismunandi nákvæmni eða mismunandi stöðlunarferli. Þetta tól notar staðlaðar formúlur og nákvæmni upp á marga aukastafi, svo mismunurinn er yfirleitt innan 1 einingar. Ef þú sérð meiri mismun getur verið að hitt tólið notið annan staðal fyrir litarými.