Zum Inhalt springen

Farbwähler online

Wähle eine beliebige Farbe im Feld oder füge einen Code ein und kopiere den Wert in HEX, RGB, HSL oder OKLCH. Mit Schattierungen, Tönen, Harmonien und einer Pipette, um Farben vom Bildschirm aufzunehmen.

Farbumwandlung

Sehen Sie den Code dieser Farbe in zehn verschiedenen Formaten, bereit zum Kopieren.

So wählst und konvertierst du eine Farbe

Mit dem Farbwähler findest du eine exakte Farbe auf drei Wegen: per Klick in das Sättigungs- und Helligkeitsfeld, durch Verschieben des Farbtons in der unteren Leiste oder durch Eingabe eines Hex-, RGB-, HSL- oder OKLCH-Codes, den du schon kennst.

Anders als der Farbkreis, der Harmonien durch Drehen eines Rads erkundet, ist dieses Werkzeug für den Fall gedacht, dass du schon eine bestimmte Farbe im Kopf hast und ihren exakten Code brauchst oder sie in ein anderes Format umrechnen willst – für CSS, für den Druck oder jeden anderen Zweck.

So verwendest du den Farbwähler

  1. 1. Farbton wählen

    Ziehe den Regler der Farbleiste, um den Farbton zu wählen: Rot, Gelb, Grün, Blau … Das ist der ganze Farbkreis, von 0° bis 360°.

  2. 2. Sättigung und Helligkeit anpassen

    Bewege im großen Feld den Punkt nach rechts für eine kräftigere Farbe und nach oben für eine hellere. Ganz unten ist immer Schwarz.

  3. 3. Code kopieren

    Wähle das Format (HEX, RGB, HSL oder OKLCH) und kopiere es mit einem Klick. Hast du schon einen Code, füge ihn oben ein und der Farbwähler springt zu dieser Farbe.

Welches Farbformat solltest du nutzen

Das ist #2C71DE in den gängigsten Formaten – und wofür jedes gut ist.

HEX#2C71DEDer Standard in CSS, HTML und Designwerkzeugen wie Figma: sechs Hexadezimalziffern.
RGBrgb(44, 113, 222)Rot, Grün und Blau von 0 bis 255. Nützlich im Code und wenn du Transparenz brauchst.
HSLhsl(217, 73%, 52%)Farbton, Sättigung und Helligkeit. Am bequemsten, um hellere oder dunklere Varianten einer Farbe zu erstellen.
HSV / HSBhsv(217 80 87)Farbton, Sättigung und Hellwert (auch HSB). Das Modell des Farbwählerfelds und vieler Designprogramme.
OKLCHoklch(0.5663 0.1805 259.49)Das moderne CSS-Format: Die Helligkeit wird gleichmäßig wahrgenommen, ideal für Skalen und Farbsysteme.
CMYKC80 M49 Y0 K13Cyan, Magenta, Gelb und Schwarz für den Druck. Eine ungefähre Umrechnung – stimme sie mit deiner Druckerei ab.

Nimm jede Farbe von deinem Bildschirm auf

Mit der Pipette erfasst du die exakte Farbe von allem, was du geöffnet hast: eine Website, ein Screenshot, ein Dokument … Klicke auf das Pipetten-Symbol, dann auf die gewünschte Stelle, und der Farbwähler zeigt sofort den Code.

Funktioniert in Chrome, Edge und anderen Chromium-basierten Desktop-Browsern. Liegt die Farbe in einem Foto, lade es in den Bild-Farbwähler hoch und extrahiere die komplette Palette.

Bild-Farbwähler öffnen

Mehr als 16 Millionen Farben

Die Zahl mag übertrieben wirken, aber ein moderner Monitor kann 16.777.216 verschiedene Farben darstellen.

Das liegt daran, dass das RGB-System drei Farbkanäle nutzt:

  • Rot (Red)
  • Grün (Green)
  • Blau (Blue)

Jeder Kanal kann einen Wert zwischen 0 und 255 haben.

Die Kombination dieser drei Werte ergibt genau:

256 × 256 × 256 = 16.777.216 Farben.

Auch wenn viele davon sehr ähnlich sind, ermöglicht diese enorme Bandbreite, den genauen Ton zu finden, den Sie brauchen, mit außergewöhnlicher Präzision, unabhängig vom Projekt.

Hier wird ein guter Farbwähler zu einem unverzichtbaren Werkzeug.

Häufige Fragen

Ein Werkzeug, mit dem du eine Farbe visuell auswählst – mit einem Feld für Sättigung und Helligkeit und einer Farbtonleiste – und ihren exakten Code in HEX, RGB, HSL oder anderen Formaten für Design oder Code erhältst.

Eine Schreibweise für Farben mit sechs Hexadezimalziffern nach der Raute: zwei für Rot, zwei für Grün und zwei für Blau. Zum Beispiel #2C71DE.

Gib den Hex-Code in den Farbwähler ein. Die Umrechnungstabelle zeigt automatisch RGB, HSL, HSV, OKLCH und CMYK zum Kopieren an.

HSL nutzt die Helligkeit im Sinne einer Mischung mit Weiß oder Schwarz, HSB (auch HSV) nutzt den Hellwert. Beide gehen von Farbton und Sättigung aus, aber die dritte Achse wird anders berechnet – dieselbe Farbe kann daher je nach Modell unterschiedliche Zahlen zeigen.

OKLCH ist ein wahrnehmungsbasierter Farbraum: L (Helligkeit), C (Chroma) und H (Farbton) entsprechen dem, wie wir Farbe tatsächlich sehen. RGB beschreibt Bildschirmlicht (Rot, Grün, Blau) und HSL ordnet dasselbe Modell intuitiver an, aber keines garantiert, dass zwei Farben gleicher Helligkeit gleich hell wirken. OKLCH schon – das ermöglicht gleichmäßigere Paletten und natürlichere Verläufe.

CMYK (Cyan, Magenta, Gelb und Schwarz) ist das Modell des Drucks: Es mischt Tinten auf Papier. Dein Monitor arbeitet mit RGB, also mit Licht. Der Farbwähler zeigt den CMYK-Code, wenn du etwas für den Druck oder ein druckfertiges PDF vorbereitest. Am Bildschirm bleibt RGB, Hex, HSL oder OKLCH das richtige Format.

Nutze die Pipette des Farbwählers, um ein beliebiges Pixel auf deinem Bildschirm aufzunehmen (in Chrome und Edge auf dem Desktop). Liegt die Farbe in einem Foto, lade es in den Bild-Farbwähler hoch.

Verwandte Tools