Keine Daten an Server gesendet — Alle Verarbeitung erfolgt im Browser
HEX
RGB
HSL
HSV
CMYK
LAB
OKLCH
HSV dient nur als Referenz. CSS hat keine hsv()-Funktion, verwenden Sie HSL.
CSS-Variable
--color-primary: #06d6a0;
Tailwind-Klasse
bg-[#06d6a0]
Tailwind v4 @theme
@theme {
  --color-primary: oklch(78% 0.16 167);
}

Der Farbkonverter ist ein kostenloses Online-Tool zur Konvertierung zwischen HEX, RGB, HSL, OKLCH und anderen Farbräumen. Enthält eine visuelle Farbauswahl, Bildpaletten-Extraktion, WCAG-Kontrastprüfung und Vorschau von Farbfehlsichtigkeit. Läuft vollständig in Ihrem Browser.

Über die Farbkonvertierung

Dieses Farb-Tool konvertiert zwischen 7 Farbräumen, erzeugt Harmonien, prüft Kontrastverhältnisse (WCAG und APCA), simuliert Farbfehlsichtigkeit und extrahiert Paletten aus Bildern. Siehe [Zahlenbasen-Konverter](/numbase) für Hex-Berechnungen oder [Bildkompressor](/image) für Bildverarbeitung.

Farbräume
HEX — kompakte 6/8-stellige RGB-Notation. Der Standard für CSS.
RGB — additive Primärfarben 0–255. Abbildung direkt auf Bildschirmpixel.
HSL — Farbton/Sättigung/Helligkeit. Für Menschen leichter zu verstehen als RGB.
HSV — Farbton/Sättigung/Wert. Häufig in Design-Tools, aber keine CSS-Funktion.
CMYK — subtraktive Primärfarben für den Druck. Näherungswert bei Konvertierung aus RGB.
LAB — wahrnehmungsgerecht; gleicher nummerischer Abstand ≈ gleicher visueller Abstand.
OKLCH — moderner wahrnehmungsgerechter Farbraum; bevorzugt von Tailwind v4 und CSS Color Module Level 4.
Kontrast (WCAG vs. APCA)

WCAG 2.1 verwendet ein Leuchtdichteverhältnis (1:1 bis 21:1) mit Schwellenwerten für AA/AAA. Es ist weit verbreitet, berücksichtigt aber nicht vollständig die Wahrnehmung von kleinem Text oder Dark Mode.

APCA ist ein Kandidat für WCAG 3 mit einem polaritätsbewussten Lc-Wert. Er korreliert besser mit der Lesbarkeit von dünnem oder kleinem Text.

Tipps

  • Verwenden Sie die Pipette, um eine Farbe von einem beliebigen Pixel auf Ihrem Bildschirm zu übernehmen (Chromium-Browser).
  • Ziehen Sie ein Bild in die Palette-Registerkarte, um seine 6 dominanten Farben mittels Median-Cut-Quantisierung zu extrahieren.
  • Tailwind v4 gibt Farben in OKLCH für wahrnehmungsgerechte Gleichmäßigkeit aus — kopieren Sie den @theme-Block, um diesen Workflow zu nutzen.

Kann ich Farben aus einem Bild extrahieren?

Ja. Ziehen Sie ein beliebiges Bild in den Paletten-Extraktionsbereich, um die dominanten Farben zu erhalten. Sie können auch Farbseh-Schwächen simulieren (Protanopie, Deuteranopie, Tritanopie).

Verwandte Tools

BildkompressorZahlenbasiskonverter