Die dominanten Farben eines Bildes ermitteln
Um eine Seite auf eine Fotografie abzustimmen, oder um die Farben einer Marke aus dem Logo zurückzugewinnen, wenn niemand den Styleguide findet.
- Läuft vollständig in deinem Browser
- Funktioniert offline
- Kein Upload
- Keine Anmeldung
- Kein Wasserzeichen
Werkzeug wird geladen…
So funktioniert es
- Zieh ein oder mehrere Bilder herein.
- Wähle, wie viele Farben du haben willst.
- Kopiere das Ergebnis als CSS-Variablen (für Webseiten) oder als JSON.
Warum nichts hochgeladen wird
Alles, was auf dieser Seite passiert, erledigt Code, der im Tab deines Browsers läuft — mit derselben Engine, die auch Webseiten darstellt. Die Datei wird von der Festplatte in den Speicher des Tabs gelesen, dort umgewandelt und als Download wieder herausgeschrieben. Sie wird nirgendwohin geschickt — weder zu uns noch zu Dritten.
Prüf es selbst nach
- Öffne die Entwicklerwerkzeuge deines Browsers (F12) und wähle den Tab „Netzwerk“.
- Lade deine Datei und starte das Werkzeug.
- Die einzigen Anfragen, die du siehst, holen den Code des Werkzeugs selbst — und bei ein paar schweren Werkzeugen dessen Open-Source-Engine von einem öffentlichen CDN — dazu ein kleines Seitenaufruf-Signal an loreatec.jp (Adresse und Titel der Seite, mehr nicht). Keine davon trägt deine Datei.
Häufige Fragen
Wie werden die Farben ausgewählt?
Ähnliche Farben werden zu Gruppen zusammengefasst, und die Gruppen werden danach sortiert, wie viel vom Bild sie einnehmen; die erste Farbe ist also die, die du als Hintergrund bezeichnen würdest. Bei gleichem Bild kommt immer dasselbe Ergebnis heraus, und das zählt, wenn du dich auf Markenfarben festlegst.
Warum wirkt die Palette etwas blass?
Weil jedes Farbfeld der Mittelwert seiner Gruppe ist. Ein Foto mit einem knallroten Logo auf einer großen grauen Wand ist überwiegend grau, und die Sortierung sagt genau das. Frag mehr Farben ab, damit die kleineren Akzente herauskommen.
Bekomme ich die exakte Farbe eines Logos?
Bei einer flächigen Grafik ja — die Flächen sind einheitlich, der Mittelwert ist also der echte Wert. Beim Foto eines gedruckten Logos nein: Das Licht verschiebt jedes Pixel, und das Ergebnis ist eine gute Annäherung.
Wird Transparenz berücksichtigt?
Transparente Pixel werden ignoriert statt als Weiß gezählt; ein PNG-Logo ohne Hintergrund ergibt also die Farben des Logos statt einer Palette, die von Weiß beherrscht wird.