Ná í HEX-lit úr mynd

Hvernig HEX-litagreiningartólið virkar

Þegar þú hleður inn mynd á þessa síðu verður hún sundurgreind pixla fyrir pixla. Tólið sýnir þér strax litinn á miðpixli myndarinnar ásamt hnitum hans. Þetta er ekki almennur litarvali – það sýnir nákvæmlega það gildi sem geymt er í myndinni, án nokkurrar meðhöndlunar eða sléttunar.

HEX kóðinn er aðalúttakið: sex stafa (stundum þriggja stafa stytting) RGB táknsnið sem er algilt í CSS og hönnunarforritum. Tólið sýnir hann sem #1E90FF þegar þú færir músina yfir myndina. Ef þú smellir á pixil bætist liturinn við söguþráðinn, allt að 12 litum.

Ólíkt systursíðunum sem leggja áherslu á RGB eða HSL fallariti, er þessi síða hönnuð fyrir þá sem þurfa HEX gildið beint. Það er engin auka setningafræði – engir svigar, engin rgb() eða hsl() umbúðir. Þú afritar #1E90FF og límir það beint í color eða background-color eigindina.

HEX litakóðinn – af hverju hann er ómissandi á vefnum

HEX táknar liti með sex sextándakerfistölum: tveimur fyrir rautt, tveimur fyrir grænt, tveimur fyrir blátt. Hver tala er á bilinu 00 (0) til FF (255). Þannig er #FF0000 hreint rautt, #00FF00 hreint grænt, og #0000FF hreint blátt.

Kostur HEX fer fram úr einfaldleikanum. Það er:

• Þéttara en RGB fallaritið (#1E90FF á móti rgb(30, 144, 255))
• Án aukastafa – engin komma eða svigar sem þarf að muna
• Almennt viðurkennt í öllum CSS vafra, hönnunarhugbúnaði og myndvinnsluforritum

Þegar þú afritar HEX gildi úr þessu tóli geturðu notað það strax. Í CSS: .box { background-color: #1E90FF; }. Í Figma: límdu #1E90FF í litareitið. Í Photoshop: veldu HEX reitinn og límdu. Engin þörf á að breyta á milli sniða.

Mikilvægt atriði: HEX kóðinn ber engar upplýsingar um gagnsæi (alfa). Ef pixillinn er hálfgegnsær sýnir tólið HEX kóðann sem #RRGGBB en bætir við textanum: „Alfa ‹n›% – þessi pixill er að hluta til gegnsær.“ Þetta er ekki villa – HEX sniðið hefur einfaldlega ekkert alfastig. Ef þú þarft alfa gildið á öðru sniði geturðu notað systursíðuna með RGBA eða bara lesið prósentuna sem birt er.

Gegnsæi og alfagildi: Það sem HEX kóði segir þér ekki

Margir gera ráð fyrir að HEX geti táknað gagnsæi – til dæmis #1E90FF80 fyrir 50% gagnsæja útgáfu. Það er rétt að sum nútíma CSS útvíkkanir (CSS Color Module Level 4) styðja átta stafa HEX (t.d. #1E90FF80), en þessi síða styðst við hefðbundið sex stafa snið. Þess vegna birtir hún alfa gildið sérstaklega sem prósentu.

Þegar pixill er hálfgegnsær les tólið nákvæmlega það gildi sem er geymt í PNG eða WebP myndinni. Þetta er mikilvægt vegna þess að:

• HEX kóðinn sýnir rauð-, græn- og bláhlutann eins og þeir koma fyrir í myndinni, óháð alfa
• Alfa prósentan er reiknuð úr gegnsæisgildinu (0–255) og birt með texta sem útskýrir hvað það þýðir

Ef þú ert að vinna með hálfgegnsæja pixla í hönnun (t.d. skugga, gradienta eða vatnsmerki) geturðu ekki bara afritað HEX kóðann og búist við sama útliti. Þú þarft að taka tillit til alfa gildisins, sem er sýnt á síðunni sem „Alfa 50% – þessi pixill er að hluta til gegnsær.“ Þetta er algeng mistök sem byrjendur gera: að halda að HEX kóðinn innihaldi allar upplýsingar um litinn.

Stækkunarglerið og nákvæm litaval

Stækkunarglerið er ekki bara flott – það er nauðsynlegt. Þegar þú ert að vinna með myndir sem hafa verið þjappaðar (JPEG) eða sem innihalda aliasing (sérstaklega á skjátexta eða brúnum) getur einn pixill verið allt öðruvísi en nágranninn. Stækkunarglerið sýnir stækkaða útgáfu af pixlunum í kringum bendilinn þannig að þú getur valið nákvæmlega þann sem þú ætlaðir þér.

Þetta er sérstaklega gagnlegt þegar:

• JPEG myndir hafa skekkt liti vegna þjöppunar – tveir aðliggjandi pixlar geta verið með mismunandi HEX gildi þótt augað sjái þá sem sama lit
• Skjámyndir innihaldi aliasing á brúnum leturs – þú gætir valið léttan bakgrunnslit í staðinn fyrir rauðan texta
• Gradientar og myndskreytingar hafa mjúkar breytingar – stækkunarglerið hjálpar þér að finna „hreinan“ lit á milli sléttra yfirferða

Þegar þú færir músina yfir myndina sérðu hnitin (x, y) á pixlinum sem er undir bendlinum. Þessi hnit eru ekki bara til upplýsinga – þau hjálpa þér að finna sama pixil aftur ef þú þarft að taka fleiri sýni úr sama svæði.

Saga lita og flýtilyklar

Söguþráðurinn inniheldur allt að 12 liti sem þú hefur smellt á. Þegar þú smellir á pixil birtist „Vistaði ‹HEX› í söguþráðinn.“ Þú getur smellt á hvaða litasýni sem er í sögunni til að hlaða því aftur – þá birtast HEX, RGB og HSL gildin aftur.

Mikilvægar reglur:

• Litir með sömu RGB gildin en mismunandi alfa gildi eru vistaðir sem sérstakir færslur. Þetta kemur í veg fyrir rugling þegar þú ert að vinna með hálfgegnsæja pixla.
• Ef þú smellir á HEX, RGB eða HSL gildi (ekki litasýnið sjálft) afritast það á klippiborðið. Ef vafrinn hindrar aðgang að klippiborðinu birtist „Ekki tókst að afrita – vafrinn þinn hindraði aðgang að klippiborðinu.“
• „Byrja upp á nýtt“ hnappurinn hreinsar allt: mynd, sögu og endurstillir tólið í upphafsstöðu.

Flýtilyklar gera þér kleift að starfa án músar:

Þetta er sérstaklega gagnlegt þegar þú þarft að taka nákvæmlega sömu hnit úr mörgum myndum, eða þegar þú ert að vinna með myndir sem hafa mjög fína smáatriði.

Takmörk tólsins: Þjöppun, aliasing og skráarstærð

Þótt tólið sýni nákvæmlega það sem er í myndinni, þá getur myndin sjálf verið villandi. Þetta er ekki galli – það er eðli stafrænna mynda.

JPEG þjöppun skekkir liti. JPEG myndir eru hannaðar til að spara pláss með því að farga litaupplýsingum sem augað sér illa. Þegar þú samplar lit úr JPEG mynd færðu því ekki endilega „réttan“ lit – þú færð litinn sem þjöppunin skilaði. Ef þú ert að vinna með vörumerkjaliti eða nákvæma litavinnslu ættir þú alltaf að nota PNG eða WebP myndir þegar mögulegt er.

Aliasing kemur fram á brúnum texta og línurita. Þegar skjárinn teiknar skáletraðan texta blandar hann saman forgrunns- og bakgrunnslit til að gera brúnir mjúkari. Þessar „blönduðu“ pixlar hafa HEX gildi sem eru hvorki nákvæmlega litur textans né bakgrunnsins. Stækkunarglerið hjálpar þér að forðast þá.

Skráarstærð – ef myndin er með lengstu hliðina > 4096 pixlar er hún sköluð niður. Þetta er gert til að koma í veg fyrir of mikið minnisálag í vafranum. Skölunin getur breytt litum lítillega, sérstaklega á brúnum. Ef nákvæmni er mikilvæg skaltu nota mynd undir 4096 pixlum.

Óstuddar skráartegundir – ef þú reynir að hlaða inn TIFF, BMP eða öðru óstuddu sniði birtist: „Tegund skráar er ekki studd. Prófaðu PNG, JPG, WebP, GIF, AVIF eða HEIC mynd.“ Ef myndin er skemmd: „Ekki tókst að opna myndina. Hún gæti verið skemmd eða í óstuddu sniði.“

Algengar spurningar

Af hverju sýnir HEX kóðinn ekki gagnsæi?

HEX kóðinn er sex stafa táknsnið sem táknar aðeins rautt, grænt og blátt. CSS Color Module Level 4 styður átta stafa HEX með alfa, en þessi síða notar hefðbundið sex stafa snið. Alfa gildið er sýnt sérstaklega sem prósenta.

Af hverju sé ég skugga eða ójöfnun á því sem átti að vera einn litur?

JPEG þjöppun og aliasing á brúnum geta valdið smávægilegum litabreytingum á aðliggjandi pixlum. Þetta sést sérstaklega vel á JPEG myndum með flötum litum eða á skjátexta. Notaðu PNG eða WebP ef þú þarft nákvæma liti.

Get ég notað örvalyklana til að færa krosshálið?

Já. Örvalyklar færa krosshár um 1 pixil, Shift + örvalykill um 10 pixla. Enter eða Space vista núverandi lit.

Hvað gerist ef ég smelli á gildið í HEX, RGB eða HSL reitnum?

Það afritast á klippiborðið. Ef vafrinn hindrar aðgang birtist viðvörun. Þetta er önnur leið til að fá HEX kóðann en að smella á myndina.

Hvað gerist ef myndin er stærri en 4096 pixlar?

Hún er sköluð niður svo lengsta hliðin verði 4096 pixlar. Skölun getur breytt litum lítillega á brúnum. Notaðu mynd undir þessari stærð ef nákvæmni skiptir mestu máli.

Af hverju fæ ég villuboð um að skráartegundin sé ekki studd?

Tólið styður PNG, JPG, WebP, GIF, AVIF og HEIC myndir. TIFF, BMP og önnur snið eru ekki studd. Myndir sem eru skemmdar eða í óþekktu sniði fá sérstök villuboð.