Screenshot-Farbwähler

Sie erhalten den exakten HEX-, RGB- und HSL-Code jedes Pixels in einem Bild.

Läuft in Ihrem Browser
Keine Uploads
Kein Konto

Ihr Browser-Tool wird geladen…

Was Screenshot-Farbwähler macht

Eine Markenfarbe, einen Button oder eine Diagrammlinie nach Augenmaß aus einem Screenshot zu treffen, ist Raterei. Laden Sie das Bild, bewegen Sie den Zeiger darüber, und eine Lupe vergrößert ein Raster von 11 × 11 Pixeln, sodass Sie genau sehen, auf welchem Pixel Sie stehen. Klicken Sie zum Auswählen: Die Farbe erscheint als großes Farbfeld mit HEX-, RGB- und HSL-Werten, jeweils mit eigenem Kopierfeld.

Die letzten zehn Farben bleiben in der Zeile „Zuletzt“, sodass Sie einige Töne vergleichen und zu einem zurückkehren können. Geglättete Kanten und Verläufe ändern sich von Pixel zu Pixel; wählen Sie aus der Mitte einer einfarbigen Fläche. Um stattdessen die Hauptfarben eines ganzen Bildes zu finden, verwenden Sie den Farbpaletten-Extraktor.

Beispiel

Ihre Auswahl

Das integrierte Beispiel einer Abrechnungsseite („Beispiel verwenden“)

Ergebnis

HEX #3157D5
RGB rgb(49, 87, 213)
HSL hsl(226, 66%, 51%)

Das Beispiel wählt einen Pixel im blauen Button „Zahlungsmethode ändern“.

Anleitung: Screenshot-Farbwähler

Wählen Sie „Datei auswählen“, fügen Sie einen Screenshot ein oder ziehen Sie ein Bild auf die Seite.
Bewegen Sie den Zeiger über das Bild, um es zu vergrößern, und klicken Sie auf den gewünschten Pixel. Für exakte Koordinaten geben Sie X und Y unter „Weitere Optionen“ ein und klicken auf „Diesen Pixel wählen“.
Klicken Sie auf „Kopieren“ für den HEX-Code, oder kopieren Sie RGB oder HSL aus ihren Feldern.

Gut zu wissen

Ein Screenshot hält die Farbe fest, die Ihr Bildschirm angezeigt hat, nach Farbprofil oder Night Shift. Sie kann leicht von der Farbe im CSS oder in der Designdatei der App abweichen.
JPG-Kompression verschiebt Farben ein wenig, besonders an Kanten. Wählen Sie aus PNG-Screenshots, wenn es auf Genauigkeit ankommt.
Transparenz ist in den Codes nicht enthalten. Bei einem halbtransparenten Pixel steht der Alphawert unter dem Bild, der HEX-Code ist aber die Farbe ohne ihn.

Fragen zu Screenshot-Farbwähler

Wie finde ich den HEX-Code einer Farbe in einem Bild?

Laden Sie das Bild, bewegen Sie den Zeiger, bis die Lupe auf der Farbe liegt, und klicken Sie. Der HEX-Code erscheint oben im Ergebnis mit einem Button „Kopieren“. RGB- und HSL-Fassungen stehen darunter.

Warum weicht die gewählte Farbe leicht von der Markenfarbe ab?

Bildschirme wenden Farbprofile an, und JPG-Kompression und Kantenglättung verändern einzelne Pixel. Wählen Sie aus der Mitte einer großen einfarbigen Fläche eines PNGs. Liegt der Wert ein paar Einheiten daneben, verwenden Sie den Code aus dem Markenhandbuch.

Kann ich eine Farbe von meinem Bildschirm außerhalb des Browsers auswählen?

Nehmen Sie zuerst einen Screenshot auf und fügen Sie ihn dann hier mit Ctrl+V oder Cmd+V ein. Der Farbwähler funktioniert mit jedem Bild, sodass ein Screenshot einer anderen App oder einer Designdatei genauso funktioniert.