- Hsl zu Hex
- HSL-Farbdarstellung:
- HEX-Farbdarstellung:
- Konvertieren von HSL in HEX:
- Konvertieren Sie Farbton in RGB:
- Konvertieren Sie Sättigung und Helligkeit in RGB:
- RGB in HEX konvertieren:
- Farbumrechnungstabelle
Hsl zu Hex
Das Konvertieren von Farben zwischen verschiedenen Darstellungen ist eine häufige Aufgabe in der Webentwicklung und im Grafikdesign. HSL (Farbton, Sättigung, Helligkeit) und HEX (Hexadezimal) sind zwei weit verbreitete Farbdarstellungen. Lassen Sie mich erklären, wie Sie von HSL in HEX konvertieren.
HSL-Farbdarstellung:
HSL steht für Farbton, Sättigung und Helligkeit. Es handelt sich um eine zylindrische Darstellung von Farben auf eine Weise, die für die menschliche Wahrnehmung intuitiver ist als RGB (Rot, Grün, Blau). Hier ist eine kurze Erklärung der einzelnen Komponenten:
- Farbton (H): Dies stellt die Farbe selbst dar. Sie wird in Grad auf einem Farbkreis gemessen, der von 0° (rot) bis 360° (wieder rot) reicht. Andere Farbtöne sind entsprechend um das Rad verteilt.
- Sättigung (S): Dies stellt die Intensität oder Reinheit der Farbe dar. Ein Sättigungswert von 0 % führt zu einer Graustufenfarbe, während höhere Werte zu lebendigeren und intensiveren Farben führen.
- Helligkeit (L): Dies stellt die Helligkeit der Farbe dar. Ein Helligkeitswert von 0 % ergibt Schwarz, 100 % ergibt Weiß, und Werte dazwischen führen zu unterschiedlichen Helligkeitsstufen.
HEX-Farbdarstellung:
HEX ist eine hexadezimale Darstellung von Farben, die häufig in der Webentwicklung verwendet werden. Es besteht aus einer Raute (#), gefolgt von sechs Zeichen, wobei jedes Zeichenpaar die Intensität der roten, grünen und blauen Komponenten der Farbe darstellt. Beispielsweise steht "#FF0000" für reines Rot, "#00FF00" für reines Grün und "#0000FF" für reines Blau.
Konvertieren von HSL in HEX:
Um eine HSL-Farbe in HEX zu konvertieren, müssen Sie Folgendes tun:
- Konvertieren Sie den Farbtonwinkel in sein RGB-Äquivalent.
- Konvertieren Sie die Sättigung und Helligkeit in RGB-Werte.
- Konvertieren Sie die RGB-Werte in hexadezimale Schreibweise.
Hier ist eine vereinfachte Formel zum Durchführen der Konvertierung:
Konvertieren Sie Farbton in RGB:
-
- Nehmen wir an, H' ist der normalisierte Farbton (skaliert zwischen 0 und 1).
- Rot = HueToRGB(H' + 1/3)
- Grün = HueToRGB(H')
- Blau = HueToRGB(H' - 1/3)
Konvertieren Sie Sättigung und Helligkeit in RGB:
-
- Der Einfachheit halber sei L' die Helligkeit, die zwischen 0 und 1 normalisiert ist.
- Wenn die Sättigung = 0 ist, dann sind R, G und B alle L' (ein Grauton).
- Andernfalls berechnen Sie die angepasste Sättigung:
- Wenn L' <= 0,5, adjustedSaturation = Sättigung * (L' + 0,5)
- Wenn L' > 0,5 ist, wird adjustedSaturation = Sättigung * (1 - L')
- Anschließend werden R, G und B mit adjustedSaturation und L' berechnet.
RGB in HEX konvertieren:
-
- Konvertieren Sie die Werte für Rot, Grün und Blau in ihre zweistelligen hexadezimalen Entsprechungen.
Da dies einige mathematische Berechnungen erfordert, ist es oft einfacher, Bibliotheken oder integrierte Funktionen zu verwenden, die in Programmiersprachen verfügbar sind, um diese Konvertierungen durchzuführen. Viele Programmiersprachen und Farbbibliotheken bieten Funktionen zum Konvertieren zwischen verschiedenen Farbdarstellungen.
Farbumrechnungstabelle
Farbname | SL (Farbton, Sättigung, Helligkeit) | RGB (Rot, Grün, Blau) | HEX Farbcode | Farbvorschau |
---|---|---|---|---|
Rot | (0°, 100%, 50%) | (255, 0, 0) | #FF0000 | |
Grün | (120°, 100%, 50%) | (0, 255, 0) | #00FF00 | |
Blau | (240°, 100%, 50%) | (0, 0, 255) | #0000FF | |
Gelb | (60°, 100%, 50%) | (255, 255, 0) | #FFFF00 | |
Zyan | (180°, 100%, 50%) | (0, 255, 255) | #00FFFF | |
Magenta | (300°, 100%, 50%) | (255, 0, 255) | #FF00FF | |
Schwarz | (0°, 0%, 0%) | (0, 0, 0) | #000000 | |
Weiß | (0°, 0%, 100%) | (255, 255, 255) | #FFFFFF |