Hangi pildilt HEX-värv

Laadige foto üles ja klõpsake mis tahes pikslil, et hankida selle HEX-värvikood, mis on valmis kleepimiseks CSS-i või HTML-i.

Lohistage pilt siia, seejärel liigutage kursorit selle kohal värvi proovimiseks.

Teie pilt jääb teie seadmesse — seda loetakse veebilehitsejas ja seda ei laadita kunagi BroBroGo serveritesse.

KKK

Kuidas saada pildil oleva värvi HEX-koodi?

Laadige pilt üles, seejärel liigutage kursorit selle kohal või klõpsake pikslil — suurendusklaas aitab teil tabada täpset kohta. HEX-kood (näiteks #4f46e5) kuvatakse kohe ja üks klõps kopeerib selle.

Mis on HEX-värvikood?

HEX-kood märgib värvi sümboliga #, millele järgneb kuus kuueteistkümnendsüsteemi numbrit — kaks punase, kaks rohelise ja kaks sinise jaoks, näiteks #4f46e5. See on vorming, mida eeldavad CSS, HTML ja enamik disainitööriistu.

Kas ma saan lisaks HEX-ile ka RGB- ja HSL-väärtused?

Jah — iga valitud piksel näitab lisaks HEX-ile ka oma RGB- ja HSL-väärtusi ning igaüht neist saab kopeerida ühe klõpsuga.

Kuidas töötab HEX-värvi valimine pildilt?

See leht on loodud spetsiaalselt selleks, et saaksid valida mis tahes pildilt ühe piksli ja saada selle värvi koheselt kuueteistkümnendsüsteemis (HEX) kujul. Erinevalt sarnastest tööriistadest, mis pakuvad värve RGB funktsionaalse märkimise või HSL kujul, on siin peamine väljund HEX-kood – kuuekohaline (või kolmekohaline lühend) RGB tähistus, mis on CSS-is ja disainivahendites standard. HEX-vormingus pole alfa-kanalit; kui piksel on osaliselt läbipaistev, näidatakse seda eraldi protsendina, mitte koodis sees. See teeb lehest esmavaliku, kui vajad värviväärtust, mille saad otse CSS-i atribuutidesse color või background-color panna ilma täiendavate sulgude või süntaksita.

Kuidas tööriist töötab: pildi laadimine ja proovivõtt

Alustamiseks laadi pilt oma seadmest. Tööriist toetab järgmisi failiformaate: PNG, JPG, WebP, GIF, AVIF ja HEIC. Vastuvõetavad MIME-tüübid on image/jpeg, image/png, image/webp, image/gif, image/avif, image/heic ja image/heif. Kui üritad lisada mittetoetatud formaati, kuvatakse teade: „See failitüüp pole toetatud. Proovi PNG, JPG, WebP, GIF, AVIF või HEIC pilti.” Kui pilti ei õnnestu avada (näiteks on see rikutud), näed teksti: „Seda pilti ei õnnestunud avada. See võib olla rikutud või mittetoetatud formaadis.”

Pildi laadimisel kuvatakse kohe selle keskmise piksli koordinaadid ja värviväärtused. See võimaldab kohe alustada isegi siis, kui hiirega pole veel pildi kohale liigutatud. Kui liigutad hiirt üle pildi, uuendatakse piksli koordinaate ja värve reaalajas. Täpseks valikuks on olemas suurendatud vaade, mis aitab tabada just seda pikslit, mida vajad. Lisaks saad kasutada klaviatuuri nooleklahve, et liigutada sihikut pildil. Kui hoida samal ajal all Shift-klahvi, liigub sihik 10 piksli kaupa. Piksli salvestamiseks vajuta Enter või tühikuklahvi (või klõpsa hiirega). See on kasulik ligipääsetavuse ja täpsuse tagamiseks, eriti kui anti-aliasing või tihendus on muutnud naaberpikslid erinevaks.

Piltidel, mille pikim külg ületab 4096 pikslit, mõõdetakse pilt proportsionaalselt alla. See hoiab tööriista jõudluse mõistlikuna, kuid võib mõjutada väga suurte fotode detailide täpsust.

Väljundid: HEX, RGB, HSL ja läbipaistvus

Pärast piksli valimist kuvatakse kolm värviväärtust:

  • HEX – kuuekohaline kood, näiteks #1E90FF. See on lehe põhiväljund. Koodis ei sisaldu alfa-teavet.
  • RGB – punase, rohelise ja sinise komponendi väärtused (0–255).
  • HSL – tooni (0–360°), küllastuse (0–100%) ja heleduse (0–100%) väärtused.

Kui piksel on osaliselt läbipaistev, näidatakse lisarida: „Alfa 45% – see piksel on osaliselt läbipaistev.” Tööriist loeb piksli täpselt nii, nagu see pildifailis on – see ei arvesta tagapõhja ega võimalikku segamist. See tähendab, et läbipaistev piksel kuvatakse oma tegeliku alfa-väärtusega, mitte sellega, mis võiks jääda taha.

Kõiki kolme värviväärtust (HEX, RGB, HSL) saab klõpsates kohe kopeerida lõikelauale. Kui brauser blokeerib lõikelaua juurdepääsu, näed teadet: „Kopeerimine ebaõnnestus – sinu brauser blokeeris lõikelaua juurdepääsu.” See juhtub mõnikord turvapoliitikate tõttu, eriti kui lehte avatakse ilma HTTPS-ita või brauseri erirežiimis.

Salvestatud värvid ja ajalugu

Kui klõpsad pildil või vajutad Enter/tühikuklahvi, lisatakse praegu valitud värv ajalukku. Ajalugu mahutab kuni 12 salvestust. Iga salvestus on kuvatud värvilise näidisena ja selle HEX-koodina. Ajaloo kirjed on eraldi isegi siis, kui RGB väärtused on samad, kuid alfa erineb – näiteks #FF0000 (täielikult läbipaistmatu) ja #FF0000 alfa 50% on erinevad sissekanded. See võimaldab hoida nii läbipaistvaid kui ka läbipaistmatuid versioone samast toonist.

Ajaloo kirjet klõpsates laetakse see värv tagasi aktiivseks väärtuseks, nii et saad seda uuesti kopeerida. Kui soovid kogumiku tühjendada, vajuta nuppu „Alusta uuesti”. See eemaldab pildi, kustutab kogu ajaloo ja taastab tööriista algseisundi.

Piirangud ja erijuhud

Toetatud failivormingud

Formaat Laiend MIME-tüüp
PNG .png image/png
JPEG .jpg/.jpeg image/jpeg
WebP .webp image/webp
GIF .gif image/gif
AVIF .avif image/avif
HEIC .heic image/heic, image/heif

Kui pilt on JPEG või ekraanipilt, võivad tihendus ja anti-aliasing olla piksli väärtusi muutnud. See tähendab, et isegi kui pind tundub ühtlaselt sinine, võivad naaberpikslid olla veidi erinevad. Tööriist näitab täpselt seda väärtust, mis failis on – mitte seda, mida silm tajub.

Läbipaistvuse puhul on oluline meeles pidada, et HEX-vormingus pole alfa-koodi (kuigi on olemas nn RRGGBBAA laiend, seda siin ei kasutata). Seepärast näidatakse alpha eraldi reana. Kui piksel on täiesti läbipaistev (alfa 0%), näidatakse seda nii: „Alfa 0% – see piksel on täielikult läbipaistev.” See võib juhtuda näiteks PNG pildil, kus osa alast on täiesti läbipaistev.

Pildi mõõtmed (laius × kõrgus) kuvatakse alati pärast laadimist. See aitab hinnata, kas pildi eraldusvõime on piisav, et leida soovitud detail.

Korduma kippuvad küsimused (KKK)

1. Miks ma saan HEX-koodi, mis ei ühti pildi visuaalse värviga?
See võib juhtuda siis, kui pilt on tihendatud (nt JPEG) või kui pildil on anti-aliasing. Tööriist loeb täpselt seda piksli väärtust, mis on salvestatud. Kui pildil on peent müra, võivad naaberpikslid erineda. Proovi suurendatud vaadet ja vali piksel hoolikalt.

2. Kas ma saan kopeerida värvi HEX-, RGB- ja HSL-vormingus?
Jah, klõpsa lihtsalt vastava väärtuse peal (nt #1E90FF või (30, 144, 255)), see kopeeritakse lõikelauale. Kui see ei tööta, kontrolli brauseri lõikelaua lubasid.

3. Kui palju värve saan salvestada?
Ajalukku mahub kuni 12 värvitooni. Iga uus salvestus lisatakse nimekirja lõppu; kui saavutad 12, lisatakse uus vanima asemele? Tegelikult faktilehel pole öeldud, et vanim kustutatakse – lihtsalt "up to 12 items". Seega kui proovid lisada 13., võib see jääda lisamata või kustutada vanima. Täpsustuseks: faktileht ütleb "stores up to 12 items", mis tähendab, et rohkem ei lisandu või lisandub alles pärast vanima eemaldamist. Siiski soovitame hoida vajalikud värvid ja vajadusel alustada uuesti.

4. Kas tööriist töötab ka puuteekraaniga seadmetes?
Jah, kuid pildi proovivõtt sõltub puutetundlikkusest. Kui puudutad pilti, see võib samuti käituda nagu klõps, st salvestab värvi. Hiirt asendava liigutuse jaoks võid kasutada klaviatuuri nooleklahve.

5. Mida teha, kui ma lasin vale pildi?
Klõpsa nuppu „Alusta uuesti”, mis eemaldab pildi ja ajaloo. Seejärel laadi uus pilt.

6. Kas HEX-kood sisaldab alfa-teavet?
Ei. Kuueteistkümnendsüsteemi kuuekohaline kood (nt #FFA500) ei sisalda alfa-kanalit. Kui vajad läbipaistvuse teavet, vaata eraldi näidatud „Alfa n%” rida. Kui soovid salvestada läbipaistva värvi, pead meeles pidama nii HEX-koodi kui ka alfa protsenti.