Cum alegi o culoare exactă dintr-o imagine: HEX, RGB și HSL

Ca să obții culoarea exactă dintr-o imagine, citește valoarea unui pixel în loc să o estimezi cu ochiul. Deschide poza în selectorul de culori, treci cu cursorul peste punctul dorit, apasă și copiază codul HEX. Valoarea citită este cea stocată pentru acel pixel, deci rămâne aceeași de fiecare dată când alegi același punct din același fișier.

Selector de culori din imagineAm nevoie de codul exact al culoriiÎncearcă gratuit

Ce stochează un pixel

Fiecare pixel este un pătrat mic de culoare. Pe ecran sau într-un fișier de imagine, el este stocat ca trei numere, pentru roșu, verde și albastru, fiecare între 0 și 255. Roșu pur înseamnă 255, 0, 0. Cele trei numere transmit aceeași informație în orice format, deci o culoare poate fi scrisă în mai multe moduri.

HEX, RGB și HSL

• HEX scrie fiecare număr în hexazecimal, cu două caractere pentru fiecare canal. #FF0000 este roșu pur. Paginile web, CSS-ul și majoritatea uneltelor de design îl folosesc.
• RGB scrie aceleași numere în zecimal, ca rgb(255, 0, 0). Este aceeași culoare caروcodul HEX.
• HSL descrie culoarea așa cum vorbesc oamenii despre ea. Nuanța este unghiul de pe cercul cromatic, saturația arată cât de intensă este culoarea, iar luminozitatea arată cât de deschisă sau închisă este. hsl(0, 100%, 50%) este roșu pur.

Folosește HEX când lipești o culoare în cod, RGB când o cere un instrument și HSL când vrei o versiune mai deschisă sau mai închisă a aceleiași nuanțe. Dacă modifici doar luminozitatea în HSL, nuanța rămâne aceeași, lucru mai greu de făcut manual cu HEX. Pentru verificarea contrastului dintre două culori, vezi HEX, RGB, HSL, CMYK și contrast.

Iată o culoare folosită într-o foaie de stiluri:

.badge {
  background: #1F7A5C;
  color: #FFFFFF;
}

De ce codul poate să nu corespundă cu ecranul

• Imaginea este comprimată. JPEG economisește spațiu netezind detaliile fine, deci pixelii de lângă o margine pot diferi puțin de culoarea pe care o vezi în mijlocul unei zone.
• Marginile se îmbină. Acolo unde se întâlnesc două culori, pixelii dintre ele sunt amestecuri. Nu sunt o culoare de sine stătătoare.
• Profilurile de culoare diferă. Selectorul citește valorile decodate de browser, care sunt în sRGB. O fotografie salvată cu un profil cu gamă largă poate arăta diferit în alte programe.
• Scalarea amestecă pixelii. O captură de ecran făcută la o dimensiune scalată a afișajului poate avea pixeli amestecați. Fă captura la dimensiune completă, când poți.
• Imaginile foarte mari sunt citite dintr-o copie. Imaginile cu latura cea mai lungă peste 6000 de pixeli sunt citite dintr-o copie de 6000 de pixeli, deci un pixel poate diferi puțin de fișierul la dimensiune completă.

Alege din mijlocul unei zone uniforme

Găsește o zonă de o singură culoare, apoi mută-te în centrul ei. Lupa arată cei 11 pe 11 pixeli din jurul cursorului, ca să vezi dacă punctul este amestecat sau uniform. Cu tastatura, mută reticulul câte un pixel cu tastele săgeți sau câte zece cu Shift, apoi apasă Enter ca să alegi. Verifică valoarea afișată înainte să o copiezi.

Folosește paleta pentru o schemă

Rareori o fotografie are o singură culoare care te interesează. Paleta listează până la șase dintre culorile ei principale. Funcționează astfel: rotunjește fiecare pixel la 16 niveluri pe canal, numără grupurile și păstrează cele mai frecvente grupuri care diferă între ele. Fiecare mostră arată media grupului său. Atinge o mostră ca să copiezi codul ei HEX. Tratează paleta ca pe un punct de plecare, pentru că este o medie și nu o culoare de brand măsurată.

Conversia între formate

Dacă un instrument de design cere un alt format, lipește codul HEX într-un convertor de culori. Acesta convertește între HEX, RGB și HSL fără să schimbe culoarea, deci rezultatul se potrivește cu codul pe care l-ai ales.

Alegerile recente și confidențialitatea

Instrumentul păstrează ultimele tale alegeri pe pagină, ca să le poți compara. Ele există doar în memoria acestui tab și dispar când îl închizi. Imaginea în sine este citită în browserul tău și nu este trimisă niciodată pe un server.

Cum faci cu fixmint

1. Deschide selectorul de culori din imagine și trage fotografia în pagină.
2. Treci cu cursorul peste punctul dorit. Sau fă clic pe imagine și folosește tastele săgeți ca să muți reticulul câte un pixel, ținând Shift pentru zece pixeli.
3. Fă clic sau apasă Enter ca să alegi culoarea. Verifică valoarea afișată înainte să o copiezi.
4. Folosește butonul Copiază de lângă HEX, RGB sau HSL ca să copiezi valoarea de care ai nevoie.
5. Dacă un instrument de design cere alt format, lipește valoarea în convertorul de culori.

Răspunsuri rapide

De ce culoarea arată diferit pe ecranul meu? Ecranul tău afișează o versiune gestionată după profil de culoare și scalată a fișierului. Alege din mijlocul unei zone uniforme și compară codul HEX cu o mostră cunoscută.

Ce format ar trebui să copiez? HEX pentru paginile web și majoritatea uneltelor de design. Folosește RGB sau HSL atunci când un instrument le cere.

Instrumentul îmi încarcă imaginea? Nu. Imaginea este decodată și citită în browserul tău.