Farbkonverter

Eine CSS-Farbe einfügen und alle Formate gleichzeitig erhalten: HEX, RGB(A), HSL(A), HWB, LAB, LCH, OKLAB, OKLCH und color(). Alpha- und Gamut-bewusst. Im Browser konvertiert — nie gesendet.

Laden…
Farbkonverter
HEX, RGB(A), HSL(A), HWB, LAB, LCH, OKLAB, OKLCH, CSS color() oder eine benannte CSS-Farbe einfügen und alle anderen Formate gleichzeitig erhalten. Alpha- und Gamut-bewusst, mit teilbarer URL.

Entwicklerhinweise

• colorjs.io ist der einzige Parser/Konverter — kein chroma-js, tinycolor2 oder culori. • Alpha multipliziert das eigene Alpha der eingefügten Farbe, sodass ein eingefügtes rgba(...) bei alphaValue=1 (Standard) sein Alpha behält. • HWB und der Block LAB/LCH/OKLAB/OKLCH/color() tragen nie ein Alpha-Suffix — nur rgba, hsla, hex8 und color() spiegeln alphaValue. • Out-of-Gamut-Farben nutzen den CSS-Color-4-Gamut-Mapping-Algorithmus, wenn gamutFallback aktiv ist; deaktiviert wird ein naiver Kanal-Clip gezeigt. • Genauigkeit rundet nur LAB/LCH/OKLAB/OKLCH/color()-Kanäle — HEX/RGB/HSL sind per Definition fix.

Optionen

  • AlphaMultipliziert das eigene Alpha der eingefügten Farbe. Berechnet Alpha für rgba, hsla, hex8 und color() neu; hex6 und einfaches HSL bleiben unverändert. Standard 1 (behält eingefügtes Alpha).
  • Moderne FormateZeigt oder blendet den Block LAB / LCH / OKLAB / OKLCH / color() aus. HEX/RGB(A)/HSL(A)/HWB bleiben immer sichtbar. Standard an.
  • Gamut-FallbackZeigt ein sichtbares Badge und einen gamut-gemappten sRGB-Wert für Weitgamut-Eingaben. Deaktiviert werden nur die rohen, möglicherweise abgeschnittenen Werte gezeigt. Standard an.
  • GenauigkeitDezimalstellen für LAB/LCH/OKLAB/OKLCH/color()-Zahlenkanäle. Gilt nicht für HEX (feste Ziffern) oder RGB/HSL (Ganzzahlen/Prozente). Standard 2.

Verwandte CSS-Tools

Hub: Farb- & CSS-Tools. Kontrast prüfen mit WCAG-Farbkontrast-Prüfer, oder Stylesheets verkleinern und formatieren mit CSS minimieren und Verschönern CSS.

FAQ — Farbkonverter

Lokal eingefügter universeller Farbkonverter

Welche Farbformate kann ich einfügen?

HEX, RGB(A), HSL(A), HWB, LAB, LCH, OKLAB, OKLCH, CSS color() (inklusive display-p3) und benannte CSS-Farben — kein Format-Umschalter nötig.

Werden meine Farben irgendwohin hochgeladen?

Nein. Parsing und Konvertierung laufen vollständig in Ihrem Browser über colorjs.io. FastMinify sendet Farben nie an einen Server.

Was passiert mit Out-of-Gamut-Farben?

Ein Badge erscheint, und bei aktivem gamutFallback zeigen die Basiszeilen HEX/RGB/HSL einen nach CSS Color 4 gamut-gemappten sRGB-Wert, klar vom rohen Weitgamut-Wert im modernen Block unterschieden.

Gilt Alpha für jedes Format?

Alpha spiegelt sich in rgba, hsla, hex8 und color(). HWB und die LAB/LCH/OKLAB/OKLCH-Kanäle bleiben alphafrei.

Farb- & CSS-Tools

Lokal eingefügte WCAG-Kontrastprüfung mit moderner CSS-Farbsyntax — Paar- und Matrixansicht, nie hochgeladen.

Weitere Werkzeugkategorien entdecken

Minimieren

Verkleinern Sie Code und Ressourcen für die Produktion – minimieren Sie JavaScript, CSS, HTML, JSON und XML vor der Bereitstellung von gzip oder CDN.

Aufheben

Erweitern Sie minimierten oder komprimierten Code – entminifizieren Sie JavaScript, CSS, TypeScript, SCSS, LESS, SQL, YAML und andere Formate beim Debuggen oder Überprüfen.

Konvertierung

Transformieren Sie Daten zwischen JSON, YAML, XML und CSV lokal – keine Server-Uploads.

Codierung

Kodieren oder dekodieren Sie Base64-, URL-Komponenten und HTML-Entitäten – nur clientseitig.

Serialisierung

Serialisieren und deserialisieren Sie PHP-Datenstrukturen neben JSON-Workflows.

JSON Werkzeuge

Validieren, formatieren, vergleichen und erkunden Sie JSON-Nutzlasten – ergänzend zu Minifiern und Konvertern.

SVG Werkzeuge

Vorschau anzeigen, mit SVGO optimieren, Daten exportieren URI, Größe ändern, verschönern, in JSX konvertieren und SVG validieren – alles in Ihrem Browser.

Verschönern

Machen Sie Code mit konsistenter Einrückung lesbar – verschönern Sie JavaScript, CSS, TypeScript, SCSS, LESS, Markdown, GraphQL, SQL, YAML und mehr in Ihrem Browser.

CSS-Präprozessoren

Kompilieren Sie SCSS oder LESS zu Standard-CSS im Browser — kombinieren Sie mit Beautify oder Minify für einen vollständigen Stylesheet-Workflow.

DevOps und Infrastruktur

Terraform HCL formatieren/validieren/minimieren, Dockerfile formatieren und lint, Docker Verfassen und .env-Validierung.

CI/CD

GitHub Aktionen und GitLab CI – formatieren Sie YAML und überprüfen Sie die Workflow-/Auftragsstruktur in Ihrem Browser.

Protokolle und Beobachtbarkeit

Zeilenorientierte JSON/NDJSON- und Nginx/Apache-Zugriffsprotokolle – formatieren, filtern, validieren und CSV/TSV.

Kubernetes

Multi-Doc-Manifeste, strukturelle Validierung, Ingress/Deployment-Starter und Helm-Werteformatierung.

Netzwerk / IP

CIDR, Subnetze und IPv4/IPv6-Helfer — im Browser.

Sicherheit und Token

JWKS, X.509-Zertifikate und Secrets-Scan – browserlokal.

API & Schemata

OpenAPI Tools zum Formatieren, Validieren und Flusen Ihrer Spezifikationen.

HTTP-Tools

cURL, HTTP-Nachrichten, URLs, HAR und Cookie/Set-Cookie lokal einfügen — formatieren und prüfen, nie gesendet.

Entwickler-Dienstprogramme

Zeitstempel, UUID, ULID, Nanoid, Cron, Passwörter, Regex, Slugify, Zahlenbasen, Groß-/Kleinschreibung, Textunterschied und chmod – alles clientseitig.

Text & Markdown

Wörter zählen, Markdown-TOC erzeugen und Zeilenlisten bereinigen — im Browser.

KI & LLM

Token-Zählung, Kostenschätzung und Kontextfenster — 100 % im Browser.

Testdaten

Synthetische Feldwerte für Fixtures und DB-Seed — zuerst reservierte Telefonnummern.