Slik velger du en nøyaktig farge fra et bilde: HEX, RGB og HSL

For å få den nøyaktige fargen fra et bilde, les verdien til én piksel i stedet for å anslå den med øyet. Åpne bildet i fargevelgeren, hold musepekeren over stedet, klikk, og kopier HEX-koden. Avlesningen er den lagrede verdien til pikselen, så den blir den samme hver gang du velger samme sted i samme fil.

BildefargevelgerTrenger eksakt fargekodeGjør det gratis

Hva en piksel lagrer

Hver piksel er en liten firkant med farge. På en skjerm eller i en bildefil lagres den som tre tall, for rød, grønn og blå, hvert fra 0 til 255. Ren rød er 255, 0, 0. Disse tre tallene inneholder den samme informasjonen i alle formater, så én farge kan skrives på flere måter.

HEX, RGB og HSL

• HEX skriver hvert tall i heksadesimal, to tegn per kanal. #FF0000 er ren rød. Nettsider, CSS og de fleste designverktøy bruker dette.
• RGB skriver de samme tallene i titallssystemet, som rgb(255, 0, 0). Det er den samme fargen som HEX-koden.
• HSL beskriver fargen slik folk snakker om den. Nyanse er vinkelen rundt fargehjulet, metning er hvor sterk fargen er, og lyshet er hvor lys eller mørk den er. hsl(0, 100%, 50%) er ren rød.

Bruk HEX når du limer inn en farge i kode, RGB når et verktøy ber om det, og HSL når du vil ha en lysere eller mørkere variant av samme nyanse. Hvis du bare endrer lyshet i HSL, beholdes nyansen, noe som er vanskeligere å gjøre med HEX for hånd. For kontrollsjekk mellom to farger, se HEX, RGB, HSL, CMYK og kontrast.

Her er en farge brukt i et stilark:

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

Hvorfor koden kan avvike fra skjermen

• Bildet er komprimert. JPEG sparer plass ved å jevne ut fine detaljer, så piksler nær en kant kan avvike litt fra fargen du ser midt i et område.
• Kanter flyter over i hverandre. Der to farger møtes, er pikslene mellom dem blandinger. De er ikke en farge i seg selv.
• Fargeprofiler er ulike. Fargevelgeren leser verdiene nettleseren dekoder, og de er i sRGB. Et foto lagret med en bred fargeprofil kan se annerledes ut i andre programmer.
• Skalering blander piksler. Et skjermbilde tatt med skalert skjermstørrelse kan ha blandede piksler. Ta skjermbildet i full størrelse når du kan.
• Svært store bilder leses fra en kopi. Bilder over 6000 piksler på lengste side leses fra en kopi på 6000 piksler, så én piksel kan avvike litt fra filen i full størrelse.

Velg fra midten av et jevnt område

Finn et område med én farge, og flytt deg så til midten. Lupen viser de 11 ganger 11 pikslene rundt pekeren, slik at du ser om stedet er blandet eller jevnt. Med tastaturet flytter du krysset én piksel om gangen med piltastene, eller ti om gangen med Shift, og trykker Enter for å velge. Sjekk avlesningen før du kopierer den.

Bruk paletten til et fargevalg

Et foto har sjelden bare én farge du bryr deg om. Paletten viser opptil seks av hovedfargene. Den fungerer ved å runde av hver piksel til 16 nivåer per kanal, telle gruppene, og beholde de vanligste gruppene som skiller seg fra hverandre. Hver fargeprøve viser gjennomsnittet av gruppen sin. Trykk på en fargeprøve for å kopiere HEX-koden. Behandle paletten som et utgangspunkt, fordi den er et gjennomsnitt og ikke en målt merkefarge.

Konvertere mellom formater

Hvis et designverktøy ber om et annet format, lim HEX-koden inn i en fargekonverterer. Den konverterer mellom HEX, RGB og HSL uten å endre fargen, så resultatet samsvarer med koden du valgte.

Nylige valg og personvern

Verktøyet lagrer de siste valgene dine på siden, slik at du kan sammenligne dem. De ligger bare i minnet til denne fanen og forsvinner når du lukker den. Selve bildet leses i nettleseren din og sendes aldri til en server.

Slik gjør du det med fixmint

1. Åpne fargevelgeren for bilder og dra inn fotoet.
2. Hold musepekeren over stedet. Eller klikk på bildet og bruk piltastene for å flytte krysset én piksel om gangen, med Shift holdt inne for ti piksler.
3. Klikk, eller trykk Enter, for å velge fargen. Sjekk avlesningen før du kopierer den.
4. Bruk Kopier-knappen ved siden av HEX, RGB eller HSL for å kopiere verdien du trenger.
5. Hvis et designverktøy ber om et annet format, lim verdien inn i fargekonverteren.

Raske svar

Hvorfor ser fargen annerledes ut på skjermen min? Skjermen din viser en fargehåndtert, skalert versjon av filen. Velg fra midten av et jevnt område, og sammenlign HEX-koden mot en kjent fargeprøve.

Hvilket format bør jeg kopiere? HEX for nettsider og de fleste designverktøy. Bruk RGB eller HSL når et verktøy ber om det.

Laster verktøyet opp bildet mitt? Nei. Bildet dekodes og leses i nettleseren din.