Farbcode-Konverter
Color Code Converter ist ein kostenloses Online-Tool, das Farbwerte sofort zwischen verschiedenen Formaten konvertiert, die in der Webentwicklung und im Webdesign verwendet werden. Konvertieren zwischen HEX (# RRGGBB), RGB (rgb (r, g, b)), RGBA (rgba (r, g, b, a)), HSL (hsl (h, s%, l%)), HSLA und CSS benannte Farben mit einem einzigen Klick. Geben Sie eine Farbe in einem beliebigen Format ein und erhalten Sie sofort alle anderen Darstellungen. Perfekt für Entwickler, die Farbwerte zwischen CSS, JavaScript, Designtools und Bildeditoren übersetzen müssen, sowie für Designer, die Farbauswahlausgaben in CSS-kompatible Formate konvertieren möchten.
Was ist
Farbcode-Konverter übersetzt Farbwerte zwischen den verschiedenen Formaten, die im digitalen Design und in der Webentwicklung verwendet werden. Verschiedene Werkzeuge und Kontexte verwenden unterschiedliche Farbnotationen, und dieser Konverter schließt die Lücke zwischen ihnen. Unterstützte Farbformate: - HEX (#RRGGBB oder #RRGGBBAA): Das gebräuchlichste Webfarbformat — eine sechsstellige hexadezimale Zeichenfolge, die rote, grüne und blaue Kanäle darstellt. Beispiel: #FF6347 (Tomate) - RGB (rgb (255, 99, 71)): Funktionale Notation, die Rot-, Grün- und Blauwerte von 0-255 angibt. - RGBA (rgba(255, 99, 71, 0.8)): RGB mit einem Alphakanal für die Deckkraft (0,0-1,0). - HSL (hsl(9, 100%, 64%)): Farbton (0-360 Grad), Sättigung (0-100%), Helligkeit (0-100%). Intuitiver für den Menschen, über Farben nachzudenken. - HSLA (hsla(9, 100%, 64%, 0.8)): HSL mit Alphakanal. - CSS Benannte Farben: 148 Standardnamen wie 'Tomate', 'Kornblumenblau', 'Rebeccapurple'. - HSVA, CMYK (designorientierte Konvertierungen) Warum es mehrere Farbformate gibt: - HEX ist kompakt und universell in HTML / CSS unterstützt - RGB entspricht der Farbwiedergabe von Bildschirmen (rotes + grünes + blaues Licht) - HSL ist intuitiv: Passen Sie die Helligkeit an, ohne den Kernton zu ändern - RGBA / HSLA fügt Transparenzsteuerung hinzu - Designwerkzeuge (Figma, Sketch) verwenden oft andere Formate als der Code erfordert Umwandlungsgenauigkeit: Alle Konvertierungen verwenden präzise mathematische Formeln aus der CSS Color Module Level 4 Spezifikation. HSL↔RGB↔HEX-Konvertierungen sind für 8-Bit-Farbkanäle verlustfrei. Alphakanalwerte werden exakt beibehalten.
Wie zu verwenden
- Geben Sie Ihren Farbwert in einem beliebigen unterstützten Format in das Eingabefeld ein. Sie können einen Hex-Code (# FF6347), einen RGB-Wert (rgb (255,99,71)), einen HSL-Wert (hsl (9,100%, 64%)) oder sogar eine CSS-Farbe (Tomate) eingeben.
- Das Tool erkennt automatisch das von Ihnen eingegebene Format und zeigt alle anderen Darstellungen in Echtzeit an. Sie müssen nicht auf eine Schaltfläche zum Konvertieren klicken - Aktualisierungen erfolgen sofort während der Eingabe.
- Zeigen Sie die Konvertierungsergebnisse in den Ausgabefenstern an. Jedes Fenster zeigt den Formatnamen, die Syntax und den formatierten Wert an. Klicken Sie auf ein beliebiges Ergebnis, um es sofort in Ihre Zwischenablage zu kopieren.
- Verwenden Sie die Farbauswahl (Pipettensymbol), um visuell eine Farbe von Ihrem Bildschirm auszuwählen. Die gewählte Farbe wird sofort in alle unterstützten Formate konvertiert.
- Überprüfen Sie das Farbvorschau-Farbfeld, um die tatsächliche Farbe zu bestätigen. In der Vorschau wird die Farbe sowohl vor hellem als auch vor dunklem Hintergrund angezeigt, damit Sie die Sichtbarkeit besser beurteilen können.
- Passen Sie bei rgba/HSLA-Konvertierungen den Alpha-Schieberegler an, um zu sehen, wie sich Änderungen der Deckkraft auf den Ausgabe-Hex-Code (8-stelliges Format) und andere Darstellungen auswirken.
Beispiele
Eingabe: HEX: #FF5733
Prozess: FF=255, 57=87, 33=51
Ergebnis: RGB(255, 87, 51) | HSL(11, 100%, 60%)
Eingabe: RGB(0, 128, 255)
Prozess: 0=00, 128=80, 255=FF | H=210, S=100%, L=50%
Ergebnis: HEX: #0080FF | HSL(210, 100%, 50%)
Verwandte Suchen
Leute suchen auch nach: farbcode-Konverter, hex zu rgb, rgb zu hsl, farbkonverter.
farbcode-Konverterhex zu rgbrgb zu hslfarbkonverter
Häufig gestellte Fragen
Was ist der Unterschied zwischen HEX- und RGB-Formaten?
HEX (# FF6347) und RGB (rgb (255, 99, 71)) repräsentieren dieselbe Farbe, verwenden jedoch eine andere Notation. HEX kombiniert alle drei Farbkanäle zu einer einzigen 6-stelligen Hexadezimalzahl (Basis-16). RGB drückt jeden Kanal separat als Dezimalzahl von 0-255 aus. HEX ist kompakter und das Standardformat in den meisten Designtools und HTML. Die funktionale RGB / HSL-Notation ist in JavaScript besser lesbar und einfacher programmgesteuert zu manipulieren (z. B. Anpassung der Helligkeit in HSL).
Soll ich HSL oder RGB für mein CSS verwenden?
HSL wird im Allgemeinen für die programmatische Farbmanipulation bevorzugt, da es intuitiver ist. Mit HSL können Sie eine Farbe abdunkeln, indem Sie den Helligkeitsanteil verringern, oder eine Farbe verschieben, indem Sie den Farbton ändern — ohne andere Aspekte zu beeinflussen. Bei RGB erfordert das Erzeugen eines dunkleren Farbtons eine proportionale Reduzierung aller drei Kanäle, was schwieriger zu begründen ist. HEX bleibt jedoch für statische Farbwerte in Stylesheets am kompaktesten.
Kann ich 8-stellige hexadezimale Farben (mit Alpha) in andere Formate konvertieren?
Ja. 8-stellige Hex-Codes (#RRGGBBAA) enthalten den Alphakanal. Zum Beispiel steht # FF634780 für Tomaten mit einer Deckkraft von 50%. Das Tool konvertiert diese in die rgba () -Notation. Wenn bei der Konvertierung von rgba () nach Hex alpha kleiner als 1,0 ist, erfolgt die Ausgabe im 8-stelligen Hex-Format. Sie können auch den Alpha-Schieberegler verwenden, um die Transparenz in Echtzeit anzupassen.
Wie konvertiere ich CMYK in RGB für die Webnutzung?
CMYK (Cyan, Magenta, Gelb, Key / Schwarz) wird für die Druckgestaltung verwendet. Um CMYK in RGB für Web / CSS zu konvertieren, verwenden Sie die CMYK-Eingabefelder (Werte 0-100 für jeden Kanal), und das Tool gibt die entsprechenden RGB-, HEX- und HSL-Werte aus. Hinweis: CMYK und RGB haben unterschiedliche Farbskalen - einige Druckfarben haben kein genaues Bildschirmequivalent. Die Umwandlung liefert die nächstgelegene RGB-Annäherung.
Unterstützt das Tool CSS4-Farbformate wie LCH oder LAB?
Das Tool unterstützt die am häufigsten verwendeten Formate (HEX, RGB, RGBA, HSL, HSLA, benannte Farben). CSS Color Module Level 4 führte LCH, LAB und OKLCH ein, die wahrnehmungsmäßig einheitlichere Farbräume bieten. Für die meisten Webentwicklungsanforderungen bietet HSL eine ausreichende Wahrnehmungsgleichmäßigkeit. Wenn Sie speziell eine LCH / LAB-Konvertierung benötigen, sind spezielle Farbwissenschaftstools möglicherweise besser geeignet.