Farbpalette Online extrahieren
Extrahiere die dominanten Farben aus jedem Bild kostenlos direkt im Browser.
.jpg, .png, .webp · bis zu 50 MB
Warum dieses Tool nutzen
Design-Paletten direkt aus echten Bildern
HEX, RGB und HSL
Erhalte Codes in allen drei gängigen Formaten, kopierbereit.
100% privat
Die Analyse erfolgt in deinem Browser. Dein Bild verlässt niemals dein Gerät.
Präziser Algorithmus
Farbquantisierung mit Median Cut für repräsentative und ausgewogene Farben.
Sofortige Verarbeitung
Palette in unter 1 Sekunde generiert. Keine Warteschlangen, keine Anmeldung, keine Beschränkungen.
So funktioniert es
Drei Schritte, kein Aufwand
Bild hochladen
Ziehe eine JPG-, PNG- oder WebP-Datei in den Bereich oder wähle sie aus. Bis zu 50 MB. Keine Anmeldung erforderlich.
Palette analysieren
Der Algorithmus extrahiert automatisch die repräsentativsten Farben. Passe die Anzahl der Farben bei Bedarf an.
Farbcodes kopieren
Erhalte HEX-, RGB- und HSL-Werte für jede Farbe. Sofort einsatzbereit für dein Design.
FAQ
Noch Fragen?
Farbquantisierung ist der Prozess, die Anzahl der unterschiedlichen Farben in einem Bild zu reduzieren und dabei das visuelle Erscheinungsbild so genau wie möglich zu erhalten. Ein Foto kann Millionen einzigartiger Farben enthalten; die Quantisierung fasst sie in einen repräsentativen Satz zusammen (beispielsweise 8 oder 16 Farben). Der klassischste Algorithmus ist Median Cut, entwickelt von Paul Heckbert 1982: Er teilt den 3D-Farbraum (RGB) in Boxen auf und spaltet bei jedem Schritt die größte Box entlang ihrer längsten Achse, wobei jeder Box die Durchschnittsfarbe der darin enthaltenen Pixel zugewiesen wird. Das Ergebnis ist eine Palette, die dominante Farben gut repräsentiert, bei seltenen Tönen aber Nuancen verlieren kann.
Für Corporate Identity und Design-Systeme lautet die Standardempfehlung: eine Palette aus 5 bis 8 Farben: 1 Primärfarbe (die repräsentativste und erkennbarste), 2–3 Sekundärfarben (komplementär zur Primärfarbe), 1–2 Akzentfarben (für Call-to-Actions und Hervorhebungen) sowie 1–2 Neutraltöne (Weiß, Schwarz, Grau für Typografie und Hintergründe). Größere Paletten (10+ Farben) sind schwer konsistent zu halten. Sehr kleine Paletten (2–3 Farben) können eintönig wirken. Zum Extrahieren einer Palette aus einem Foto für künstlerische oder Inspirationszwecke erfassen 6 bis 10 Farben die visuelle Essenz in der Regel gut.
HEX ist die hexadezimale Darstellung von RGB: #FF5733 entspricht R=255, G=87, B=51. Es ist das am häufigsten verwendete Format in CSS und Webdesign wegen seiner Kompaktheit. RGB (Rot, Grün, Blau) ist das additive Lichtmodell: Die Mischung aller drei Kanäle auf Maximum ergibt Weiß (255,255,255). Es ist intuitiv für Entwickler, die Farbberechnungen vornehmen. HSL (Farbton, Sättigung, Helligkeit) ist für Designerinnen und Designer am intuitivsten: H ist der Winkel auf dem Farbkreis (0°=Rot, 120°=Grün, 240°=Blau), S ist die Sättigung (0%=Grau, 100%=reine Farbe), L ist die Helligkeit (0%=Schwarz, 50%=reine Farbe, 100%=Weiß). Das Ändern einer Farbe in HSL ist vorhersehbarer: Um eine Farbe abzudunkeln, reduziert man einfach L, ohne den Farbton zu beeinflussen.
Die 60-30-10-Regel ist das am häufigsten verwendete Prinzip in Innen- und Grafikdesign: 60 % des visuellen Raums nutzen die dominante Farbe (meist ein Neutralton oder die Hauptmarkenfarbe), 30 % die Sekundärfarbe (schafft Kontrast und Tiefe) und 10 % die Akzentfarbe (Call-to-Actions, Hervorhebungen). Im Web-Interface-Design adaptiert sich diese Proportion zu: Hintergrund (60 %, meist Weiß oder Hellgrau), Inhalt und Typografie (30 %, Dunkelgrau oder Schwarz), interaktive Elemente (10 %, lebhafte Markenfarbe). Die Regel garantiert visuelle Kohärenz ohne Monotonie, da stets genug Tonabwechslung vorhanden ist, um eine visuelle Hierarchie zu schaffen.
Komplementärfarben liegen sich auf dem Farbkreis gegenüber (Rot/Grün, Blau/Orange, Gelb/Violett). Sie erzeugen maximalen visuellen Kontrast und werden für Elemente eingesetzt, die sich klar vom Hintergrund abheben müssen. In Sport- und Energiemarken sind Rot auf Grün und Blau auf Orange klassische Kombinationen. Analoge Farben liegen nebeneinander auf dem Farbkreis (Rot, Orange, Gelb). Sie erzeugen Harmonie und ein Gefühl von Einheit. Sie sind angenehmer und weniger visuell aggressiv. Für lange Nutzeroberflächen (Apps, Websites) sind analoge Farbschemata ruhiger für das Auge. Die dritte Kategorie, triadische Farben (drei gleichmäßig verteilte Farben: Rot, Gelb, Blau), balanciert Kontrast mit Harmonie.
Farbtheorie: Pantone-System, Quantisierung und barrierefreie Paletten
Die Farbtheorie hat ihre Wurzeln in Physik und visueller Wahrnehmung. Isaac Newton demonstrierte 1666, dass weißes Licht die Summe aller Spektralfarben ist, indem er Sonnenlicht durch ein Prisma leitete. Johannes Itten, Professor am Bauhaus in den 1920er-Jahren, formalisierte den Farbkreis als pädagogisches Werkzeug und etablierte harmonische Beziehungen, die noch heute die Grundlage modernen Farbdesigns bilden. Josef Albers, ebenfalls vom Bauhaus, ging noch weiter: In seinem Buch Interaction of Color (1963) demonstrierte er, dass unsere Farbwahrnehmung nicht absolut, sondern relativ zu ihrem Kontext ist – ein Phänomen namens Simultankontrast. Ein Grau auf schwarzem Hintergrund erscheint heller als dasselbe Grau auf weißem Hintergrund, obwohl der Grauwert identisch ist.
Das Pantone-System, 1963 von Lawrence Herbert in New Jersey gegründet, löste ein fundamentales Problem der Druckindustrie: Zwei Druckereien in verschiedenen Städten konnten dasselbe Rot nicht reproduzieren, ohne ein gemeinsames Referenzsystem. Pantone erstellte ein standardisiertes Musterbuch (Pantone Matching System, PMS) mit eindeutigen Nummern für jede Farbe und präzisen Tintenrezepturen. Heute umfasst das System mehr als 1.800 Farben für den Druck auf Papier, Textilien und Kunststoffen. Der Median-Cut-Algorithmus, die Grundlage der digitalen Farbquantisierung, löst das entgegengesetzte Problem: Gegeben eine Menge von Millionen Farben, finde die N repräsentativsten. Der Algorithmus wurde später von Xiaolin Wu (1992) mit seiner Octree-Quantisierungsmethode optimiert, schneller und mit besserer Qualität für kleine Paletten.
Barrierefreie Farbpaletten sind ein entscheidender Aspekt des Interface-Designs. Farbenblindheit betrifft 8 % der Männer und 0,5 % der Frauen europäischer Abstammung, mit niedrigeren Raten bei anderen Ethnien. Die häufigste Form, die Rot-Grün-Farbenblindheit (Deuteranopie und Protanopie), lässt Rot und Grün ununterscheidbar erscheinen. Nur mit Rot und Grün Zustände zu unterscheiden (Fehler/Erfolg) schließt Millionen von Nutzerinnen und Nutzern aus. Die Lösung besteht nicht darin, Rot und Grün zu vermeiden, sondern zusätzliche Unterscheidungsmerkmale hinzuzufügen (Icons, Text, Form) und ausreichend unterschiedliche Helligkeitsvariationen zu verwenden. Tools wie Coblis ermöglichen die Visualisierung jedes Bildes, wie es von Personen mit verschiedenen Formen der Farbenblindheit wahrgenommen wird.