raatools/

Farbkonverter

Farben zwischen HEX, RGB und HSL sofort umwandeln.

#4F46E5
rgb(79, 70, 229)
hsl(243, 75%, 59%)
HSL-Farbwähler
hex
#4f46e5
rgb
rgb(79, 70, 229)
hsl
hsl(243, 75%, 59%)
rgba
rgba(79, 70, 229, 1)

Was ist ein Farbkonverter?

Ein Farbkonverter uebersetzt Farbwerte zwischen verschiedenen Farbmodellen wie HEX, RGB, HSL, HSV und CMYK. Designer und Entwickler arbeiten oft mit mehreren Formaten gleichzeitig.

Jedes Farbmodell repraesentiert Farben anders. RGB mischt Rot, Gruen und Blau fuer Bildschirme. CMYK mischt Cyan, Magenta, Gelb und Schwarz fuer den Druck. HSL beschreibt Farbton, Saettigung und Helligkeit intuitiv.

Farbmodelle erklaert

  • HEX — eine 6-stellige Hexadezimaldarstellung von RGB (#FF5733). Am haeufigsten in CSS und Webdesign verwendet.
  • RGB — Rot, Gruen, Blau je 0-255. Additives Farbmischen fuer Bildschirme. rgb(255, 87, 51) ist ein lebhaftes Orange.
  • HSL — Farbton (0-360 Grad), Saettigung (0-100 %) und Helligkeit (0-100 %). Am intuitivsten fuer die Farbauswahl durch Menschen.
  • HSV/HSB — Farbton, Saettigung, Helligkeit. Aehnlich wie HSL, aber in Grafikprogrammen wie Photoshop bevorzugt.
  • CMYK — subtraktive Farbmischung fuer den Druck. Werte 0-100 % fuer jeden Kanal.

So verwenden Sie dieses Tool

Geben Sie einen Farbwert in einem beliebigen Format ein — HEX, RGB, HSL, HSV oder CMYK — und alle anderen Werte werden sofort berechnet. Verwenden Sie den Farbwaehler fuer die visuelle Auswahl.

Farben in der Webentwicklung

CSS unterstuetzt HEX, RGB, RGBA, HSL, HSLA und benannte Farben. Moderne Browser unterstuetzen auch die neueren CSS-Farbraeume wie oklch und display-p3 fuer lebhaftere Farben ausserhalb des sRGB-Gamuts.

Haeufig gestellte Fragen

Welches Farbformat sollte ich in CSS verwenden?

HSL ist am lesbarsten und einfachsten anzupassen (Helligkeit oder Saettigung aendern). HEX ist am kompaktesten. RGB ist am besten geeignet, wenn Sie mit Design-Tools arbeiten, die RGB-Werte ausgeben.

Warum sieht die gleiche Farbe auf verschiedenen Bildschirmen anders aus?

Monitore haben verschiedene Farbgamuts, Kalibrierungen und Panel-Technologien. Ein #FF0000 (reines Rot) sieht auf einem sRGB-Monitor anders aus als auf einem Display-P3-Bildschirm. Kalibrieren Sie Ihren Monitor fuer Farbgenauigkeit.