HEX in HWB
HEX in HWB umrechnen, kostenlos und online in deinem Browser. Füge einen HEX-Code ein und du bekommst den CSS-Wert hwb() mit Farbton, Weiß- und Schwarzanteil zum Kopieren. HWB lässt sich gut von Hand anpassen: Mehr Weiß hellt auf, mehr Schwarz dunkelt ab.
So rechnest du HEX in HWB um
- 1Füge einen HEX-Code in „Farbe“ ein oder wähle ihn mit dem Farbwähler
- 2Lies den hwb()-Wert in der großen Zeile unter dem Feld ab
- 3Klicke auf die Kopieren-Schaltfläche daneben
- Deine Farbe als hwb(), bereit für dein CSS
So funktioniert es
- In CSS-Schreibweise.Das Ergebnis sieht aus wie hwb(45.07 10.2% 0%), so wie CSS Color 4 es vorsieht
- Nichts wird verschickt.Die Umrechnung ist ein bisschen Rechnen, das in deinem Browser läuft
- Alle Schreibweisen darunter.RGB, HSL, Lab, OKLCH, XYZ und mehr stehen in einer Liste, jede mit eigenem Kopierknopf
Was du tun kannst
- Einen HEX-Code in hwb() umwandeln, etwa #FFC61A in hwb(45.07 10.2% 0%) oder #2563EB in hwb(221.21 14.5% 7.8%)
- Kurze und lange HEX-Codes eingeben: #FC0, #FFCC00 und auf dieser Seite auch ohne #
- Stattdessen rgb(), hsl(), lab(), oklch() oder einen CSS-Farbnamen einfügen und trotzdem HWB erhalten
- Eine Farbe mit dem Farbwähler deines Browsers aussuchen, der HWB-Wert zieht sofort mit
- Jede andere Schreibweise derselben Farbe aus der Liste kopieren und den nächsten CSS-Namen und die nächsten Tailwind-Farben sehen
Gut zu wissen
- HWB beschreibt dieselben sRGB-Farben wie HEX, nur anders geschrieben. Bei der Umrechnung geht nichts verloren
- Der Farbton hat bis zu zwei Nachkommastellen, Weiß und Schwarz eine. Sie beziehen sich auf die 8-Bit-Farbe des HEX-Codes
- Ein Grau hat keinen Farbton und wird mit 0 geschrieben, zum Beispiel hwb(0 50.2% 49.8%) für #808080
- Ein HEX-Code mit Alphawert wie #FFCC0080 wird ohne seine Transparenz gelesen
Fragen
Was ist HWB?
HWB steht für Hue, Whiteness und Blackness, also Farbton, Weiß- und Schwarzanteil. Du gehst von einem reinen Farbton aus und mischst Weiß und Schwarz dazu. In CSS heißt das hwb(Farbton Weiß Schwarz), etwa hwb(200 30% 20%).
Wozu HEX in HWB umrechnen?
Einen HEX-Code kann man schlecht nach Gefühl ändern. In HWB machst du eine Farbe heller, indem du den Weißanteil erhöhst, und dunkler über den Schwarzanteil. Der Farbton bleibt dabei gleich.
Kann ich hwb() in meinem Stylesheet verwenden?
Ja. hwb() gehört zu CSS Color 4, und aktuelle Browser verstehen es. Kennt ein Programm, mit dem du arbeitest, es nicht, bleib dort beim HEX-Code.
Wird meine Farbe an einen Server geschickt?
Nein. Dein Browser rechnet den HEX-Code auf deinem eigenen Gerät um. Es wird keine Anfrage damit gestellt.
Weitere Tools in „Web & Code“
Diese Seite gibt es nicht. Such unten oder zieh eine Datei hierher, um das passende Werkzeug zu finden.
Eine Website für jede Dateiaufgabe. Welche ist deine?
Schluss mit dem Hin und Her zwischen Konverter-Websites. Wähle eines von 410+ Tools oder ein Rezept, das mehrere aneinanderreiht.
- Dateien bleiben auf deinem Gerät
- Kein Wasserzeichen
- Funktioniert offline
Datei hierher ziehen
Eine eingefügte Datei geht auch.
oder such ein Tool
Eine App öffnen
Von „uff, diese Datei“ zu erledigt, in drei Schritten.
- Zieh sie rein oder wähl eine Aufgabe
Keine Datei? Such, was du brauchst. Dateien werden auf deinem Gerät verarbeitet, nicht zur Verarbeitung hochgeladen.
- Wähl, was du willst
Kleiner, ein anderes Format, unterschrieben, zusammengefügt. Ein Klick, ohne erst Einstellungen zu studieren.
- Mach ein Rezept daraus
Jede Woche dieselben drei Schritte? Reih sie einmal aneinander und lass beim nächsten Mal dasselbe Rezept laufen.
Ein freigegebener Werkzeugkasten für das ganze Team.
Ob im Büro, auf der Baustelle oder in der Agentur: Teams arbeiten den ganzen Tag mit vertraulichen Dateien. ToolRecipe gibt allen dieselben Werkzeuge und dieselben Rezepte, und die Dateien werden auf dem eigenen Computer jeder Person verarbeitet.
- Dateien werden auf dem Gerät der Mitarbeitenden verarbeitet
- Firmenrezepte, die alle gleich ausführen
- Ein Ort statt zehn Konverter-Seiten