Was ist eine Komplementärfarbe?

Es ist die Farbe, die im Farbkreis genau gegenüber deiner Grundfarbe liegt (180° Farbtonabstand) — zusammen erzeugen sie einen starken visuellen Kontrast.

Wann sollte ich Komplementärfarben verwenden?

Sie eignen sich gut für Call-to-Action-Buttons, Akzente oder überall dort, wo ein Element aus seiner Umgebung hervorstechen soll.

Ist das dasselbe wie analoge Farben?

Nein — analoge Farben liegen im Farbkreis nebeneinander für einen harmonischen Look, Komplementärfarben liegen gegenüber für Kontrast.

Komplementärfarben-Generator

Finde die Komplementärfarbe zu jeder Hex-Farbe.

Dieses Tool läuft vollständig in deinem Browser. Deine Dateien werden niemals auf einen Server hochgeladen.

Base

#3b82f6

Complementary

#f6af3b

Was dieser Generator macht

Erzeugt eine Zwei-Farben-Palette aus einer Basis-HEX-Farbe und ihrem HSL-Komplement. Die zweite Farbe behält die umgerechnete Sättigung und Helligkeit bei und dreht den Farbton um 180 Grad auf dem Farbkreis.

Anwendung

Wähle eine Farbe mit dem Farbwähler oder gib einen drei- oder sechsstelligen HEX-Wert ein, mit oder ohne führendes #. Das Tool normalisiert die Basis auf einen kleingeschriebenen sechsstelligen HEX-Code und lässt dich beide Muster kopieren.

Rechenbeispiel

Die Standardfarbe #3b82f6 wird von RGB in HSL umgerechnet, ihr Farbton um 180° verschoben und das Ergebnis zurück in RGB und HEX konvertiert. Kleine Kanalabweichungen können durch die abschließende RGB-Rundung entstehen.

Verwendete Methode

Komplementärton = Basiston + 180° modulo 360°. Sättigung und HSL-Helligkeit bleiben erhalten. Bei Graustufen ist die Sättigung null, sodass der Tonwechsel keinen sichtbaren Effekt hat und das Komplement derselbe Grauton bleibt.

Kontrast- und Farbgrenzen

Gegenüberliegende HSL-Töne garantieren weder ein bestimmtes WCAG-Kontrastverhältnis noch gleiche wahrgenommene Helligkeit. Alpha, Farbprofile, Druckfarbräume, Farbsehunterschiede und umgebende Farben im Design werden nicht berücksichtigt.

Praktische Anwendung

Nutze das Paar als Ausgangspunkt für Akzente, teste es dann im echten Kontext und prüfe den Textkontrast separat, bevor du ein Design veröffentlichst.

Datenschutz

Die Umrechnung läuft lokal in deinem Browser; eingegebene Farben werden nicht hochgeladen.

Häufig gestellte Fragen

Was ist eine Komplementärfarbe?: Es ist die Farbe, die im Farbkreis genau gegenüber deiner Grundfarbe liegt (180° Farbtonabstand) — zusammen erzeugen sie einen starken visuellen Kontrast.
Wann sollte ich Komplementärfarben verwenden?: Sie eignen sich gut für Call-to-Action-Buttons, Akzente oder überall dort, wo ein Element aus seiner Umgebung hervorstechen soll.
Ist das dasselbe wie analoge Farben?: Nein — analoge Farben liegen im Farbkreis nebeneinander für einen harmonischen Look, Komplementärfarben liegen gegenüber für Kontrast.

Analoge Farben-Generator

Erzeuge ein harmonisches analoges Farbschema aus jeder Grundfarbe.

Triadischer Farben-Generator

Erzeuge ein ausgewogenes triadisches Farbschema aus jeder Grundfarbe.

Farbpaletten-Generator

Erzeuge mit einem Klick eine zufällige 5-Farben-Palette.

Farbton- und Abtönungs-Generator

Erzeuge Aufhellungen und Abdunklungen jeder Grundfarbe.

Zufälliger Farbgenerator

Erzeuge mit einem Klick zufällige Hex- und RGB-Farben.

CMYK-Farbkonverter

Konvertiere jede Hex- oder RGB-Farbe für den Druck in CMYK.