← Alle Beiträge

Wie du eine Farbpalette aus jedem Bild ziehst

2026-06-25

Einige der besten Farbpaletten existieren bereits — in einem Sonnenuntergangsfoto, einem Filmstandbild, einem Markenlogo, einem Screenshot eines Designs, das dir gefällt. Statt Hex-Codes zu raten, kannst du die Farben einfach direkt aus dem Bild aufnehmen. So geht es, und so verwandelst du sie in brauchbare Werte für dein CSS oder Design-Tool.

Warum Farben aus einem Bild ziehen

Eine Palette von Grund auf zu bauen ist schwer; eine zu leihen, die bereits funktioniert, ist leicht. Ein Foto hat natürliche Harmonie, weil das Licht in der Szene die Farben zusammengebunden hat. Das Logo einer Marke reicht dir ihre exakten Farben. Von einem echten Bild auszugehen bringt dir eine Palette, die sich stimmig anfühlt, und dann verfeinerst du.

Wie die Pipette funktioniert

Ein Bild ist ein Raster aus Pixeln, und jedes Pixel hat eine Farbe. Ein Farbwähler (Pipette) liest die exakte Farbe des Pixels, auf das du zeigst, und meldet sie als Code — meist HEX (#f59563), was dieselben Rot/Grün/Blau-Werte in Hexadezimal geschrieben sind. Fahr mit der Maus darüber für eine Vorschau, klick, um die zu speichern, die dir gefallen, und schon hast du eine Palette.

ToolKoalas Farbwähler macht genau das in deinem Browser:

  1. Zieh ein beliebiges Bild hinein — ein Foto, einen Screenshot, ein Logo.
  2. Fahr darüber für eine Farbvorschau; klick, um sie zu speichern. Bau so viele auf, wie du willst.
  3. Jede gespeicherte Farbe gibt dir HEX und RGB zum direkten Kopieren in deinen Code.

Es läuft lokal, sodass das Bild, aus dem du Farben nimmst, nie hochgeladen wird.

HEX, RGB, HSL — welches brauchst du?

Dieselbe Farbe, verschiedene Schreibweisen:

  • HEX (#f59563) — der Web-Standard; das, was du am häufigsten in CSS einfügst.
  • RGB (245, 149, 99) — praktisch, wenn du einen Alphakanal (rgba(...)) für Transparenz brauchst.
  • HSL (Farbton, Sättigung, Helligkeit) — das, was Designer zum Anpassen einer Farbe lieben: die Helligkeit verschieben für eine Tönung, den Farbton verschieben, um eine Komplementärfarbe zu finden.

Wenn du eine Farbe in einem Format hast und ein anderes brauchst, verwandelt der Farbkonverter HEX sofort in RGB, HSL, HSV und CMYK.

Aus Aufnahmen eine echte Palette machen

Ein paar Gewohnheiten, die eine aufgenommene Palette brauchbar machen:

  • Greif eine Bandbreite, nicht fünf fast identische Töne — ein dunkler, ein heller, ein paar Mitteltöne und ein Akzent.
  • Prüfe den Kontrast für alles, worauf Text steht. Ein wunderschönes kontrastarmes Paar ist unlesbar.
  • Nutze HSL, um Varianten zu bauen — sobald du eine Basisfarbe hast, passe die Helligkeit für Hover-Zustände, Ränder und Hintergründe an, statt unverwandte neue Farben zu wählen.

Häufige Fragen

Wie bekomme ich den Farbcode aus einem Bild? Nutze einen Farbwähler: lade das Bild, fahr für eine Vorschau darüber und klick auf das Pixel, dessen Farbe du willst. Er meldet die Farbe als HEX-Code (und meist RGB), den du kopieren kannst. ToolKoalas Farbwähler macht das im Browser.

Was ist der Unterschied zwischen HEX, RGB und HSL? Sie sind drei Arten, dieselbe Farbe zu schreiben. HEX ist der Web-Standard, RGB ist nützlich für Transparenz (rgba), und HSL ist am einfachsten zum Anpassen einer Farbe — Helligkeit oder Farbton von Hand zu ändern.

Kann ich Farben aus einem Screenshot oder Logo aufnehmen? Ja — jedes Bild funktioniert, einschließlich Screenshots und Logos. Das ist oft der schnellste Weg, die exakten Farben einer Marke zu treffen.

Lädt der Farbwähler mein Bild hoch? Nein. ToolKoala liest die Pixel in deinem Browser, sodass das Bild dein Gerät nie verlässt.

Wie konvertiere ich eine HEX-Farbe in RGB oder HSL? Füge sie in einen Farbkonverter ein. ToolKoalas Farbkonverter verwandelt jedes HEX auf einmal in RGB, HSL, HSV und CMYK.

— Milo 🐨