Eine Palette aus jedem Foto, Logo oder Screenshot
Der Bild-Farbextraktor findet die dominanten Farben eines Bildes und macht daraus eine sofort nutzbare Palette. Zieh ein Produktfoto, den Screenshot eines Mitbewerbers, ein Moodboard-Bild oder dein eigenes Logo hinein und du bekommst 4 bis 12 Hex-Codes, die du einzeln kopieren oder gesamt exportieren kannst. Alles passiert in deinem Browser: Die Datei wird auf ein verstecktes Canvas gezeichnet, auf 256 Pixel verkleinert und dort abgetastet. Sie wird nie hochgeladen – vertrauliche Entwürfe und unveröffentlichte Artworks bleiben auf deinem Rechner.
So funktioniert es
- Zieh ein Bild in die Ablagefläche oder klicke, um eines auszuwählen. Jedes vom Browser lesbare Format funktioniert, darunter JPEG, PNG, WebP, GIF und SVG.
- Stell den Regler Farben zwischen 4 und 12 ein, um die Anzahl der Farbflächen festzulegen. Weniger ergibt das grobe Thema, mehr erfasst auch Akzente und Schatten.
- Klicke auf eine Farbfläche, um ihren Hex-Code zu kopieren, oder auf Exportieren, um das ganze Set als CSS-Variablen, Tailwind-Config, SCSS, JSON, Figma Tokens, Adobe ASE oder GIMP GPL zu erhalten.
- Füge eine Farbe in den Kontrast-Checker ein, um die Lesbarkeit als Text zu prüfen, oder übergib sie dem Paletten-Generator für Farbharmonien.
Beispiele
- Marke aus einem Logo: extrahiere 5 Farben aus einem Logo-PNG, exportiere sie als Tailwind, und deine Buttons und Überschriften passen exakt zur Marke.
- Theme aus einem Foto: ein Sonnenuntergangsfoto liefert ein warmes Orange, ein tiefes Lila und ein sandiges Neutral – ein komplettes Landingpage-Theme in einem Schritt.
- Eine bestehende Website nachbauen: mach einen Screenshot einer Seite, die dir gefällt, und zieh ihre Palette heraus, um zu sehen, wie sie Primärfarbe und Neutraltöne ausbalanciert.
Tipps
- Schneide das Bild zuerst auf den relevanten Bereich zu; ein großer weißer Hintergrund dominiert sonst das Ergebnis.
- Starte mit 6 Farben. Geh nur höher, wenn ein sichtbarer Akzent fehlt.
- Extrahierte Farben sind als Textfarbe selten barrierefrei; prüfe jede gegen Weiß und Schwarz, bevor du sie für Fließtext verwendest.
- Du brauchst eine Palette für eine Stimmung, die du beschreiben kannst, aber kein Bild hast? Probiere stattdessen den KI-Paletten-Generator.