So funktioniert es
Wähle ein Foto, ein Logo oder einen Screenshot aus, und seine Hauptfarben werden mit dem Median-Cut-Algorithmus (median cut) ermittelt, der die Farben des Bildes immer wieder in gleich große Gruppen aufteilt. Zu jeder Farbe siehst du ihren HEX-Code und welchen Anteil des Bildes sie einnimmt, und die ganze Palette lässt sich als CSS-Variablen kopieren.
Bild → Farben nach Ähnlichkeit gruppiert → Durchschnittsfarbe jeder Gruppe
Gute Einsatzzwecke
- Eine Marken- oder Website-Palette aus einem Produktfoto erstellen.
- Die Farben von Folien, Postern oder Vorschaubildern auf ein Bild abstimmen.
- Die exakten Farben eines Logos oder einer Illustration finden.
Tipps
- Weniger Farben zeigen die dominanten Töne, mehr Farben bringen auch Akzente zum Vorschein.
- Transparente Bereiche von PNG-Bildern werden ignoriert.
- Das Bild wird auf deinem Gerät analysiert und nie hochgeladen.
Grundlagen und Quellen
- Die Farbquantisierung nutzt den Median-Cut-Algorithmus (median cut, Heckbert, 1982)
- Die Farben werden in sRGB angegeben, wie im CSS Color Module Level 4 definiert
Zuletzt geprüft am 7. Oktober 2026
Häufige Fragen
Wie werden die Hauptfarben ausgewählt?
Der Median-Cut-Algorithmus teilt die Bildfarben immer wieder in Gruppen auf und nimmt den Durchschnitt jeder Gruppe, sodass häufige Farben hervortreten.
Wie viele Farben sollte ich extrahieren?
Vier bis sechs geben die Gesamtstimmung wieder; acht bis zwölf erfassen auch kleinere Akzente.
Funktioniert das mit Logos und Screenshots?
Ja. Flächige Grafiken liefern sehr exakte Farben, und transparente PNG-Bereiche werden ignoriert.
Wird mein Bild hochgeladen?
Nein. Das Bild wird in deinem Browser verkleinert und analysiert und verlässt nie dein Gerät.
Kann ich die Farben in CSS verwenden?
Ja. Kopiere den Block mit CSS-Variablen oder tippe auf eine Farbe, um ihren HEX-Code zu kopieren.