Farbpalette aus Bild extrahieren — HEX/RGB & Anteil, ohne Upload (kostenlos)

Bild hier ablegen oder klicken zum Auswählen

Unterstützt PNG, JPEG, WebP und GIF

Ihr Bild wird nie hochgeladen — die gesamte Verarbeitung findet in Ihrem Browser statt.

Verwendung

Ziehen Sie ein Bild in den Bereich oben, oder klicken Sie, um den Dateiauswähler zu öffnen. PNG, JPEG, WebP und GIF werden akzeptiert.
Die dominante Farbpalette erscheint sofort — jedes Farbmuster zeigt den HEX-Code, RGB-Werte und den ungefähren Anteil der Farbe im Bild.
Verwenden Sie den Schieberegler, um die Anzahl der zu extrahierenden Farben (2–12) zu wählen. Die Palette wird sofort aktualisiert, ohne das Bild neu zu laden.
Klicken Sie auf ein Muster oder die Kopierschaltfläche, um den HEX zu kopieren. Verwenden Sie 'Alle HEX kopieren', um alle Farben auf einmal zu erhalten.
Wechseln Sie zum Tab Exportieren, um einen einfügbaren CSS-Variablen-Block oder JSON zu erhalten, dann kopieren oder herunterladen.
Keine Installation, keine Registrierung. Ihr Bild verlässt Ihr Gerät nicht.

Funktionen und Funktionsweise

Extraktion dominanter Farben (Palette des gesamten Bildes)

Das Tool sammelt nicht nur einen einzelnen Pixel — es analysiert das gesamte Bild mithilfe der Median-Cut-Farbquantisierung. Der Algorithmus gruppiert ähnliche Farben in Cluster und wählt für jeden eine repräsentative Farbe, um die gesamte Farbgeschichte des Bildes wiederzugeben. Für die Geschwindigkeit wird das Bild vor der Analyse verkleinert (längste Seite ≤ 160 px).

HEX, RGB und Anteil (%) jeder Farbe

Jede extrahierte Farbe zeigt ihren HEX-Code (#RRGGBB, Großbuchstaben), RGB-Werte und ihren ungefähren Anteil am Bild. Farben werden nach Anteil in absteigender Reihenfolge sortiert. Hinweis: Der Anteil ist ein Näherungswert und ergibt möglicherweise nicht genau 100% aufgrund unabhängiger Rundung.

Anzahl der zu extrahierenden Farben wählen

Verwenden Sie den Schieberegler, um die Anzahl der Farben von 2 bis 12 einzustellen. Eine Änderung der Anzahl erfolgt sofort — ohne Neuladen des Bildes.

Kopieren und Exportieren (CSS-Variablen / JSON)

Jedes Farbmuster hat eine Schaltfläche zum Kopieren des HEX, und 'Alle HEX kopieren' nimmt alle Farben auf einmal. Das Export-Panel generiert einen einfügbaren CSS-Variablen-Block oder ein JSON-Objekt. Farbwerte sind immer CSS-kompatibel.

Kein Upload — Ihr Bild bleibt auf Ihrem Gerät

Laden, Skalieren und Farbanalyse erfolgen lokal mithilfe der Canvas API des Browsers. Ihr Bild wird nie an einen Server gesendet, gespeichert oder geteilt.

Anwendungsfälle

Farbpalette aus einem Referenzbild oder Foto extrahieren

Ziehen Sie ein Foto, eine Illustration oder einen Screenshot eines Designs, das Ihnen gefällt. Die Palette zeigt die Hauptfarben und ihre Proportionen — ein hervorragender Ausgangspunkt für den Aufbau einer Farbpalette für eine Website oder ein Designprojekt.

Markenfarben aus einem Logo oder Marken-Asset erhalten

Ziehen Sie ein Logo oder Marken-Asset, um die genauen HEX-Codes jeder Farbe zu erhalten. Nützlich, um sicherzustellen, dass Ihre Website, Dokumente und Präsentationen die richtigen Markenfarben verwenden.

Farben direkt nach CSS oder JSON exportieren

Verwenden Sie das Export-Panel, um CSS-Variablen oder ein JSON-Objekt direkt in Ihren Code zu kopieren. Der Anteil zeigt, welche die dominante Farbe, der Akzent usw. ist.

Hinweise und Einschränkungen

Näherungswerte: Das Tool verkleinert das Bild vor der Analyse und gruppiert ähnliche Farben, daher sind die extrahierten Farben und Anteile Näherungswerte.
Anteile ergeben möglicherweise nicht 100%: Jeder Farbanteil wird unabhängig auf eine Dezimalstelle gerundet. Die Summe kann leicht über oder unter 100% liegen.
Weniger Farben als angefordert: Wenn das Bild weniger eindeutige Farben hat als die gewählte Anzahl, werden nur die vorhandenen Farben zurückgegeben. Keine Phantomfarben werden hinzugefügt.
Transparente Pixel werden ausgeschlossen: Bei PNG-Bildern mit Transparenz werden vollständig oder größtenteils transparente Pixel (Alpha < 128) nicht gezählt.
Animiertes GIF: Nur der erste Frame des animierten GIF wird analysiert.

Häufige Fragen

Wird mein Bild an einen Server hochgeladen?: Nein. Die gesamte Verarbeitung erfolgt lokal in Ihrem Browser mithilfe der Canvas API. Ihr Bild wird nie gesendet, gespeichert oder geteilt.
Kann ich die gesamte Farbpalette extrahieren, nicht nur eine Farbe?: Ja, das ist die Hauptfunktion. Das Tool verwendet Median-Cut-Quantisierung, um das gesamte Bild zu analysieren und die repräsentativsten Farben als Palette zurückzugeben, jede mit ihrem Anteil.
Wie genau ist der Anteil (%) jeder Farbe?: Es ist ein Näherungswert. Das Bild wird vor der Analyse verkleinert und ähnliche Farben werden gruppiert, daher spiegelt der Anteil die Farbpräsenz in der verkleinerten Stichprobe wider, nicht eine exakte Pixelanzahl.
Wie viele Farben kann ich extrahieren?: Von 2 bis 12. Verwenden Sie den Schieberegler, um die Anzahl einzustellen. Wenn das Bild weniger eindeutige Farben hat als angefordert, werden nur die vorhandenen zurückgegeben — keine Phantomfarben werden hinzugefügt.
Welche Bildformate werden unterstützt?: PNG, JPEG, WebP und GIF (nur erster Frame). SVG, HEIC und andere Formate werden nicht unterstützt.
Kann ich die extrahierten Farben in meinem Code verwenden?: Ja. Jede Farbe hat eine Schaltfläche zum Kopieren des HEX mit einem Klick, und das Export-Panel generiert CSS-Variablen oder ein JSON-Objekt mit HEX, RGB und Ratio — bereit zum Einfügen in Ihr Projekt.
Was passiert mit einem transparenten PNG?: Transparente Pixel (Alpha unter 128) werden von der Analyse ausgeschlossen, sodass sie nicht als Schwarz oder Weiß in der Palette erscheinen. Ein vollständig transparentes Bild gibt keine Farben zurück.