HEX · RGB · HSL · HSV · CMYK
Farbumrechner
Die Farbe #0060fd ist rgb(0, 96, 253), hsl(217, 100%, 50%) und cmyk(100%, 62%, 0%, 1%). Gib eine beliebige CSS-Farbe ein oder nutz die Farbauswahl, um deine eigene umzurechnen.
- #0060fd = rgb(0, 96, 253)
- #0060fd = hsl(217, 100%, 50%)
- #0060fd = cmyk(100%, 62%, 0%, 1%)
- red = #ff0000
Die Kacheln aktualisieren sich beim Tippen. Ist der Text keine Farbe, erscheint ein Fehler, und die letzte gültige Farbe bleibt auf dem Bildschirm.
Scanned by NortonTM Safe Web
Auf einen Blick
- Preis
- Ohne Kosten
- Konto
- Nicht nötig
- Upload
- Entfällt – du tippst eine Farbe, nichts wird irgendwohin gesendet
- Eingabe
- HEX (3, 4, 6 oder 8 Ziffern), rgb(), hsl(), hwb(), 148 CSS-Farbnamen und transparent
- Ausgabe
- HEX, RGB, HSL, HSV, CMYK und der nächste CSS-Farbname
- CMYK
- Mathematische Umrechnung, kein Druckprofil
Gängige Farben in jedem Modell
Diese Zeilen wurden vom selben Code erzeugt wie der Umrechner. HSL, HSV und CMYK sind auf ganze Zahlen gerundet.
| Eingegeben | HEX | RGB | HSL | HSV | CMYK |
|---|---|---|---|---|---|
| #0060fd | #0060fd | rgb(0, 96, 253) | hsl(217, 100%, 50%) | hsv(217, 100%, 99%) | cmyk(100%, 62%, 0%, 1%) |
| red | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | hsv(0, 100%, 100%) | cmyk(0%, 100%, 100%, 0%) |
| white | #ffffff | rgb(255, 255, 255) | hsl(0, 0%, 100%) | hsv(0, 0%, 100%) | cmyk(0%, 0%, 0%, 0%) |
| black | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) | hsv(0, 0%, 0%) | cmyk(0%, 0%, 0%, 100%) |
| grey | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) | hsv(0, 0%, 50%) | cmyk(0%, 0%, 0%, 50%) |
| transparent | #00000000 | rgba(0, 0, 0, 0) | hsla(0, 0%, 0%, 0) | hsv(0, 0%, 0%) | cmyk(0%, 0%, 0%, 100%) |
So rechnest du eine Farbe um
Farbe eingeben
Gib einen HEX-Code mit 3, 4, 6 oder 8 Ziffern ein, einen rgb()-, hsl()- oder hwb()-Wert oder einen der 148 CSS-Farbnamen. Du kannst auch auf das Farbfeld klicken und die Farbe mit der Farbauswahl deines Browsers wählen.
Die anderen Modelle ablesen
Das Farbfeld zeigt die Farbe über einem Schachbrettmuster, sodass Transparenz sichtbar ist. Die Kacheln zeigen dieselbe Farbe als HEX, RGB, HSL, HSV und CMYK sowie den nächsten CSS-Farbnamen.
Kopieren, was du brauchst
Drück bei einer Kachel auf Kopieren, um den Wert in die Zwischenablage zu legen, bereit zum Einfügen in ein Stylesheet, ein Design-Tool oder ein Dokument.
Wie die Farbmodelle zusammenhängen
RGB beschreibt eine Farbe als die Mengen an rotem, grünem und blauem Licht, die ein Bildschirm addiert, jeweils von 0 bis 255; #0060fd ist 0 Rot, 96 Grün und 253 Blau. HEX sind dieselben drei Zahlen zur Basis 16 geschrieben, also wird aus 96 die 60 und aus 253 fd. HSL und HSV beschreiben dieselbe Farbe als Farbtonwinkel von 0 bis 360 Grad auf dem Farbkreis plus zwei Prozentwerte: Sättigung und Helligkeit (HSL) bzw. Hellwert (HSV). #0060fd hat in beiden den Farbton 217. CMYK beschreibt Druckfarbe: Cyan, Magenta, Gelb und Schwarz werden vom weißen Papier abgezogen.
Das hier gezeigte CMYK ist die einfache mathematische Umrechnung: Schwarz ist 1 minus das Größte von R, G und B, und Cyan, Magenta und Gelb sind der Rest. Es ist kein Druckprofil, ein Drucker oder ein Designprogramm mit ICC-Profilen liefert für dieselbe Farbe also andere CMYK-Zahlen. HSL-Werte werden als ganze Zahlen angezeigt, daher kann das Zurückrechnen eines gerundeten Werts einen Kanal um ein paar Einheiten verschieben: hsl(217, 100%, 50%) ist #0062ff, nicht #0060fd. Der nächste CSS-Name ist das Schlüsselwort mit dem kleinsten CIE76-Farbabstand im L*a*b*-Raum. Alles läuft in deinem Browser, und nichts wird irgendwohin gesendet.
Fragen zum Farbumrechner
Wie rechne ich HEX in RGB um?
Teile die sechs Ziffern in drei Paare und lies jedes Paar als Zahl zur Basis 16. #0060fd ist 00, 60 und fd, also 0, 96 und 253, die Farbe ist somit rgb(0, 96, 253). Füg den HEX-Code in das Feld ein, und die RGB-Kachel zeigt das Ergebnis.
Was bedeuten die letzten beiden Ziffern eines 8-stelligen HEX-Codes?
Sie sind der Alphakanal, die Deckkraft, von 00 (völlig transparent) bis ff (völlig deckend). #0060fd80 ist dasselbe Blau bei 128 von 255, etwa 50.2% Deckkraft, und wird daher als rgba(0, 96, 253, 0.502) angezeigt. Ein 4-stelliger Code wie #06f8 funktioniert genauso, wobei jede Ziffer verdoppelt wird.
Was ist der Unterschied zwischen HSL und HSV?
Beide nutzen Farbton und Sättigung, aber der dritte Wert unterscheidet sich. In HSL ist eine Helligkeit von 50% die reine Farbe, 0% ist Schwarz und 100% Weiß. In HSV ist ein Hellwert von 100% die hellste Version der Farbe, und Weiß braucht eine Sättigung von 0%. Dasselbe Blau ist hsl(217, 100%, 50%) und hsv(217, 100%, 99%).
Kann ich das CMYK-Ergebnis für den Druck verwenden?
Nutz es nur als Ausgangspunkt. Diese Seite verwendet die einfache Formel zwischen RGB und CMYK, die nichts von Druckfarben, Papier oder dem Profil eines Druckers weiß. Eine Druckerei oder ein Designprogramm mit Farbprofil rechnet dieselbe RGB-Farbe in andere CMYK-Zahlen um.
Welche Farbformate kann ich eingeben?
HEX mit oder ohne #, mit 3, 4, 6 oder 8 Ziffern; rgb() und rgba() mit Kommas oder Leerzeichen, Zahlen oder Prozentwerten und optionalem Alpha nach einem Schrägstrich; hsl(), hsla() und hwb() mit einem Winkel in deg, rad, grad oder turn; die 148 CSS-Farbnamen wie rebeccapurple; und transparent.
Warum passt der nächste Farbname nicht genau?
CSS kennt nur 148 Farbnamen, die meisten Farben haben also keinen eigenen Namen. Die Seite wählt den Namen, dessen Farbe am ähnlichsten aussieht, gemessen als CIE76-Farbabstand im L*a*b*-Raum; für #0060fd ist das mediumslateblue. Ist die Farbe genau eine benannte, etwa #ff0000, sagt die Seite, dass sie genau übereinstimmt.