Pontos szín kiválasztása képből: HEX, RGB és HSL

A kép pontos színének megállapításához egy pixel értékét olvasd ki, ne szemmel becsüld meg. Nyisd meg a képet a színválasztóban, vidd a kurzort a kiszemelt pontra, kattints, majd másold ki a HEX kódot. Az eredmény az adott pixel tárolt értéke, ezért ugyanazt a pontot ugyanabban a fájlban mindig ugyanannak a színnek fogod látni.

Képszín kiválasztóPontos színkódra van szükségemPróbáld ki ingyen

Mit tárol egy pixel

Minden pixel egy apró színes négyzet. Képernyőn vagy képfájlban három számmal tárolódik: vörös, zöld és kék csatornával, mindegyik 0 és 255 közötti érték. A tiszta piros értéke 255, 0, 0. Ez a három szám minden formátumban ugyanazt az információt hordozza, így ugyanaz a szín többféleképpen is leírható.

HEX, RGB és HSL

• HEX: csatornánként két karakteres hexadecimális szám. A #FF0000 a tiszta piros. Weboldalak, CSS és a legtöbb tervezőeszköz ezt használja.
• RGB: ugyanazok a számok tizedes alakban, rgb(255, 0, 0) formában. Ugyanaz a szín, mint a HEX kód.
• HSL: úgy írja le a színt, ahogyan az emberek beszélnek róla. A színárnyalat (hue) a színkörön mért szög, a telítettség (saturation) a szín erősségét, a világosság (lightness) pedig azt mutatja, mennyire világos vagy sötét. A hsl(0, 100%, 50%) a tiszta piros.

HEX-et használj, ha kódba másolsz színt, RGB-t, ha egy eszköz ezt kéri, és HSL-t, ha ugyanannak az árnyalatnak a világosabb vagy sötétebb változatára van szükséged. HSL-ben csak a világosságot módosítva az árnyalat megmarad, ami kézzel HEX-kóddal nehezebb. Két szín kontrasztjának ellenőrzéséhez lásd: HEX, RGB, HSL, CMYK és kontraszt.

Íme egy stíluslapban használt szín:

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

Miért nem egyezik a kód a képernyőn látottal

• A kép tömörített. A JPEG a részletek elsimításával takarít helyet, ezért a szélek közelében lévő pixelek kissé eltérhetnek attól a színtől, amelyet egy egységes terület közepén látsz.
• Az élek elmosódnak. Ahol két szín találkozik, a köztes pixelek keverékek, nem önálló színek.
• Eltérő színprofilok. A választó a böngésző által dekódolt értékeket olvassa, ezek sRGB-ben vannak. Egy széles gamut profillal mentett fotó más programokban másképp nézhet ki.
• A méretezés keveri a pixeleket. Egy skálázott kijelzőről készült képernyőkép kevert pixeleket tartalmazhat. Ha lehet, teljes méretben készítsd a képernyőképet.
• A nagyon nagy képek másolatból készülnek. A leghosszabb oldalukon 6000 pixelnél nagyobb képek 6000 pixeles másolatról olvasódnak, így egy-egy pixel kissé eltérhet a teljes méretű fájltól.

Válassz egy egységes terület közepéről

Keress egy egyszínű területet, majd menj a közepére. A nagyító a kurzor körüli 11 x 11 pixelt mutatja, így látod, hogy a pont kevert vagy egységes-e. Billentyűzettel a nyilakkal egyesével mozgathatod a célkeresztet, Shift nyomvatartásával pedig tízesével, a kiválasztáshoz pedig nyomd meg az Entert. A másolás előtt ellenőrizd a kijelzett értéket.

Paletta használata színsémához

Egy fotón ritkán csak egyetlen szín fontos. A paletta legfeljebb hat főszínt sorol fel. Úgy működik, hogy minden pixel csatornánként 16 szintre kerekítődik, megszámolja a csoportokat, és a leggyakoribb, egymástól eltérő csoportokat tartja meg. Minden színminta a csoportja átlagát mutatja. Koppints egy mintára a HEX kódjának másolásához. A palettát kiindulópontnak tekintsd, mert átlagot mutat, nem mért márkaszínt.

Átváltás a formátumok között

Ha egy tervezőeszköz más formátumot kér, illeszd be a HEX kódot a színkonverterbe. Az átváltás HEX, RGB és HSL között történik úgy, hogy a szín nem változik, így az eredmény megegyezik a kiválasztott kóddal.

Legutóbbi kiválasztások és adatvédelem

Az eszköz az utolsó kiválasztásaidat az oldalon tartja meg, hogy össze tudd őket hasonlítani. Csak az adott lap memóriájában élnek, és a lap bezárásakor elvesznek. Maga a kép a böngésződben dolgozódik fel, és soha nem kerül szerverre.

Így csináld a fixminttel

1. Nyisd meg a képszín kiválasztót, és húzd rá a fotót.
2. Vidd a kurzort a kiszemelt pontra. Vagy kattints a képre, és a nyilakkal egyesével mozgasd a célkeresztet, Shift nyomvatartásával tízesével.
3. Kattints, vagy nyomd meg az Entert a szín kiválasztásához. A másolás előtt ellenőrizd a kijelzett értéket.
4. A HEX, RGB vagy HSL mellett lévő Másolás gombbal másold ki a szükséges értéket.
5. Ha egy tervezőeszköz más formátumot kér, illeszd be az értéket a színkonverterbe.

Gyors válaszok

Miért más a szín a képernyőmön? A képernyőd a fájl színkezelt, skálázott változatát mutatja. Egy egységes terület közepéről válassz, és hasonlítsd össze a HEX kódot egy ismert színmintával.

Melyik formátumot másoljam? Weboldalakhoz és a legtöbb tervezőeszközhöz a HEX-et. RGB-t vagy HSL-t akkor használj, ha egy eszköz ezeket kéri.

Feltölti az eszköz a képemet? Nem. A kép dekódolása és olvasása a böngésződben történik.