HSL í HEX breytir

Hvað gerir þessi síða?

Þessi síða breytir HSL-litagildum í HEX-litakóða. Notandinn slær inn litblæ (hue) í gráðum á bilinu 0–360, mettun (saturation) sem hundraðshluta og ljósafl (lightness) sem hundraðshluta. Við hverja breytingu birtist samsvarandi HEX-kóði samstundis. HEX-kóðinn er sex stafa (eða þriggja stafa stytting) sextándatöluform sem notað er víða í CSS og hönnunarforritum, til dæmis #1E90FF. Allar aðrar litagildingar (RGB, HSV, CMYK, LAB) uppfærast jafnframt sjálfkrafa.

Síðan er hönnuð til að vera einföld og án óþarfa breyta. Notandinn sér nákvæmlega það sem hann slær inn: engar falinn stillingar eða viðbótarreiti. Þetta gerir síðuna að beinu tæki fyrir alla sem vinna með HSL-liti og þurfa að breyta þeim í HEX fyrir framkvæmd í kóða eða hönnunarverkefnum.

Hvað aðgreinir þessa síðu?

Ólíkt mörgum litabreytum sem reyna að þjóna öllum mögulegum litakerfum í einu, er þessi síða sérstaklega tileinkuð HSL‑til‑HEX umbreytingunni. HSL er litakerfi sem hannað er með mannlega skynjun að leiðarljósi: að breyta ljósafli eitt og sér breytir ekki litblænum, sem gerir það kjörið fyrir litatöflur og þemagerð. HEX er aftur á móti sex stafa (eða þriggja stafa styttri) RGB-táknun; það ber ekki með sér gagnsæi nema í átta stafa formi.

Umbreytingin frá HSL yfir í HEX er bein og tapalaus innan sRGB litvíddarinnar. Þetta er andstætt við umbreytingar sem fara í gegnum LAB eða CMYK, þar sem litir sem falla utan viðkomandi gamma kunna að vera stilltir eða klipptir af. Hér gerist ekkert slíkt: ef HSL-gildið er innan sRGB rammans, þá er HEX-kóðinn fullkomlega nákvæmur.

Síðan leggur áherslu á hraða og áreiðanleika. Engin gögn eru send úr vafranum; allt vinnsla fer fram staðbundið. Þetta tryggir næði og gerir síðuna hraða, jafnvel á hægum tengingum.

Inntak og úttak

Inntak er þrískipt:

• Litblær (hue): 0–360 gráður. Dæmi: 243.
• Mettun (saturation): 0–100%. Dæmi: 75%. Prósentumerkið er nauðsynlegt.
• Ljósafl (lightness): 0–100%. Dæmi: 59%. Einnig með prósentumerki.

Inntakið má slá inn sem 243, 75%, 59% eða með svigum, en sniðið verður að vera skýrt.

Úttak:

• Aðalúttakið er HEX-kóði, til dæmis #4f46e5. Ef allar RGB-rásirnar geta verið táknaðar með einum sextándatölustaf hver, birtir síðan einnig þriggja stafa styttingu (t.d. #abc fyrir #aabbcc).
• Jafnframt uppfærast allar aðrar litagildingar: RGB (eins og rgb(79, 70, 229)), HSV, CMYK og LAB. Þetta gerir kleift að bera saman mismunandi litakerfi á einum stað.

Tafla með dæmum:

Öll reitur eru tengd: ef þú breytir HEX, breytast HSL, RGB og önnur gildi samstundis. Engin handvirk endurreikningur er nauðsynlegur.

Reglur og jaðartilvik

Ef HSL-gildin eru utan leyfilegra marka (litblær ekki á bilinu 0–360, mettun eða ljósafl ekki 0–100%) eða ekki rétt sniðin (til dæmis vantar prósentumerkið), birtir síðan villuskilaboðin:
„Enter HSL as hue 0–360 with two percentages, like 243, 75%, 59%.“

Umbreytingin frá HSL yfir í HEX fer alltaf fram innan sýnilegs RGB-sviðs. Engin aðlögun utan gamma á sér stað, þar sem HSL‑til‑HEX umbreytingin er beintæk og tapalaus. CMYK-gildin sem birtast samhliða eru áætluð á skjánum og geta verið frábrugðin faglegum prentungildum. Ef nákvæmni við prentun skiptir máli, ætti notandi að staðfesta gildin með litastjórnunarhugbúnaði.

Allar útreikningar fara fram beint í vafranum; engar upplýsingar sem slegnar eru inn eru sendar eða vistaðar. Þetta er sérstaklega mikilvægt þegar unnið er með viðkvæm hönnunargögn.

Hver notar þetta?

Hönnuðir sem byggja upp litatöflur í HSL og þurfa HEX-kóða til að fella í kóða eða hönnunarforrit (t.d. Figma eða Sketch). HSL gerir þeim kleift að vinna á eðlilegri mannlegri skynjun en RGB, og síðan er auðvelt að breyta niðurstöðunni í HEX fyrir framkvæmd.

Vefhönnuðir sem fá HSL-gildi úr hönnunarskrám og þurfa að þýða þau yfir í CSS-HEX eiginleika. Dæmi: skylda myndi vera að fá litinn hsl(243, 75%, 59%) úr hönnun og setja hann í CSS sem color: #4f46e5.

Allir sem stilla þemu eða beita aðgengissjónarmiðum með því að breyta ljósafli í HSL til að ná tilskildum WCAG birtuskilum, og þurfa síðan HEX-gildi til að nota í framleiðslu.

Þekktar villur og ráðleggingar

Algeng mistök þegar HSL er slegið inn:

• Að sleppa prósentumerkinu fyrir mettun eða ljósafl. Einföld tala eins og 50 er talin ógild; rétt er 50%.
• Að setja litblæ á bilinu 360+ eða neikvæðan. Litblær verður að vera innan. Neikvæð gildi eða gildi >360 valda villuskilaboðum.
• Að nota kommu frekar en punkt fyrir tugabrot í litblæ? Hugsanlegt, en gildið má vera tugabrot (t.d. 243.5). Almennt er betra að nota punkt (.).
• Að rugla saman HSL og HSLA. Sex stafa HEX ber ekki gagnsæi, svo ef alpha-þörf er fyrir hendi, þarf annaðhvort að nota átta stafa HEX eða RGBa.

Síðan sýnir villu nákvæmlega þegar eitthvað er rangt; engar truflanir eða óskýrar villuboð.

Algengar spurningar (FAQ)

1. Hvað geri ég ef ég fæ villuboðin „Enter HSL as hue 0–360 with two percentages“?
Athugaðu hvort litblæs­gildið sé á bilinu 0–360, hvort mettun og ljósafl hafi % merkið og að allar tölur séu aðskildar með kommu eða bili. Einnig athugaðu hvort þú hafir slegið inn fleiri en þrjá hluti – til dæmis ekki bæta við alpha-gildi.

2. Get ég notað þriggja stafa HEX-kóða sem úttak?
Já, ef allar RGB-rásir geta verið táknaðar með einum sextándatölustaf (t.d. #FF0000 verður #F00), birtir síðan báðar útgáfur. Þú getur valið þá sem hentar betur. Hins vegar er alltaf hægt að nota sex stafa kóðann til öryggis.

3. Er umbreytingin alltaf tapalaus?
Innan sRGB litvíddarinnar, já. HSL‑til‑HEX umbreytingin gengur í gegnum RGB sem millistig og tapar engu, þar sem bæði HSL og HEX starfa innan sama gamma. Ef liturinn er utan sRGB (sjaldgæft fyrir HSL skilgreiningu), getur HSL verið utan marka, en síðan krefst þess að HSL-skilgreiningin sé innan og 0–100%, sem tryggir að niðurstaðan sé innan sRGB.

4. Hvernig er CMYK reiknað?
CMYK er áætlað út frá RGB-gildunum með einföldu formúlu. Það er eingöngu til viðmiðunar á skjá; faglegt prentverk krefst sérstakrar litastjórnunar og ICC-sniða. Notaðu ekki þessi CMYK-gildi beint fyrir prentun án prófunar.

5. Get ég breytt HEX beint í HSL á þessari síðu?
Nei, síðan er sérhæfð í HSL‑til‑HEX áttina. Ef þú þarft að breyta HEX í HSL, er til systursíða (HEX-til-HSL) sem vinnur á sama hátt. Þessi síða sýnir hins vegar HSL-gildin sem samsvara slegnu HEX, ef þú reynir að breyta HEX-reitnum.

6. Virkar síðan á snjallsímum?
Já, allt vinnslan fer fram í vafranum og hönnunin er viðbragðsmikil. Slegið er inn með snertilyklaborði og HEX-kóðinn birtist samstundis. Engin viðbótarforrit eða uppsetning þarf.