HSLA in XYZ D65 umrechnen

HSLA-Wert einfügen und sofort XYZ D65 erhalten. Andere Formate funktionieren auch.

Aus HSLA

Erkannt als HSL

XYZ D65-Wertcolor(xyz-d65 0.45245 0.2832 0.06216 / 0.8)

XYZ D65 in HSLA

Dieselbe Farbe ohne Transparenz, als deckendes XYZ D65

Farbe anpassen

Farbton11°

Deckkraft80 %

Helligkeit68 %

Chroma0,210

Farbton34°

Alle anderen Formate

Deckkraft-Tabelle: HEX-Alpha und HSLA

Bei 8-stelligem HEX legen die letzten zwei Ziffern die Deckkraft fest: FF ist voll deckend, 80 etwa 50 %, 00 völlig transparent. Die Tabelle zeigt die Beispielfarbe in 5-%-Schritten.

Deckkraft	HEX-Alpha	HEX	HSLA
100%	ff	#ff5733	hsla(10.59, 100%, 60%, 1)
95%	f2	#ff5733f2	hsla(10.59, 100%, 60%, 0.95)
90%	e6	#ff5733e6	hsla(10.59, 100%, 60%, 0.9)
85%	d9	#ff5733d9	hsla(10.59, 100%, 60%, 0.85)
80%	cc	#ff5733cc	hsla(10.59, 100%, 60%, 0.8)
75%	bf	#ff5733bf	hsla(10.59, 100%, 60%, 0.75)
70%	b3	#ff5733b3	hsla(10.59, 100%, 60%, 0.7)
65%	a6	#ff5733a6	hsla(10.59, 100%, 60%, 0.65)
60%	99	#ff573399	hsla(10.59, 100%, 60%, 0.6)
55%	8c	#ff57338c	hsla(10.59, 100%, 60%, 0.55)
50%	80	#ff573380	hsla(10.59, 100%, 60%, 0.5)
45%	73	#ff573373	hsla(10.59, 100%, 60%, 0.45)
40%	66	#ff573366	hsla(10.59, 100%, 60%, 0.4)
35%	59	#ff573359	hsla(10.59, 100%, 60%, 0.35)
30%	4d	#ff57334d	hsla(10.59, 100%, 60%, 0.3)
25%	40	#ff573340	hsla(10.59, 100%, 60%, 0.25)
20%	33	#ff573333	hsla(10.59, 100%, 60%, 0.2)
15%	26	#ff573326	hsla(10.59, 100%, 60%, 0.15)
10%	1a	#ff57331a	hsla(10.59, 100%, 60%, 0.1)
5%	0d	#ff57330d	hsla(10.59, 100%, 60%, 0.05)
0%	00	#ff573300	hsla(10.59, 100%, 60%, 0)

Beispiele: HSLA in XYZ D65

Farbe	HSLA	XYZ D65
	hsla(0, 100%, 50%, 1)	color(xyz-d65 0.41239 0.21264 0.01933)
	hsla(120, 100%, 50%, 1)	color(xyz-d65 0.35758 0.71517 0.11919)
	hsla(240, 100%, 50%, 1)	color(xyz-d65 0.18048 0.07219 0.95053)
	hsla(0, 0%, 100%, 1)	color(xyz-d65 0.95046 1 1.08906)
	hsla(0, 0%, 0%, 1)	color(xyz-d65 0 0 0)
	hsla(0, 0%, 50.2%, 1)	color(xyz-d65 0.20517 0.21586 0.23508)
	hsla(10.59, 100%, 60%, 1)	color(xyz-d65 0.45245 0.28319 0.06216)
	hsla(217.22, 91.22%, 59.8%, 1)	color(xyz-d65 0.26419 0.23548 0.90345)
	hsla(160.12, 84.08%, 39.41%, 1)	color(xyz-d65 0.21524 0.36391 0.26659)
	hsla(37.69, 92.13%, 50.2%, 1)	color(xyz-d65 0.49942 0.43893 0.06159)
	hsla(258.31, 89.53%, 66.27%, 1)	color(xyz-d65 0.31107 0.19797 0.89374)
	hsla(330.37, 81.19%, 60.39%, 1)	color(xyz-d65 0.42658 0.2477 0.32673)

Über HSLA und XYZ D65

HSLA ist HSL mit Alphakanal für die Deckkraft, geschrieben als hsla(11, 100%, 60%, 0.5). Alpha reicht von 0 (völlig transparent) bis 1 (voll deckend), modernes CSS akzeptiert es auch in hsl().

CIE XYZ ist der Referenzraum, aus dem alle anderen Farbräume abgeleitet sind. Konverter nutzen ihn als gemeinsame Basis zwischen den Formaten.

So funktioniert die Umrechnung

Wir lesen den HSLA-Wert, rechnen ihn mit den Matrizen aus der Spezifikation CSS Color 4 in CIE XYZ um und von dort in XYZ D65. Werte außerhalb des Zielfarbraums passt der Algorithmus aus CSS Color 4 an: Helligkeit und Farbton bleiben, das Chroma sinkt.

Fragen und Antworten

Wie rechne ich HSLA in XYZ D65 um?

Füge einen HSLA-Wert in das Feld oben ein oder tippe ihn ein. PickShade rechnet schon beim Tippen mit den Formeln aus CSS Color 4 um, und ein Klick kopiert den XYZ D65-Wert.

Ist die Umrechnung von HSLA in XYZ D65 exakt?

Die Rechnung ist exakt. Gerundet wird nur für die Anzeige, mit so vielen Stellen, dass die Rückrechnung dieselbe Farbe ergibt. Passt die Farbe nicht in den Zielfarbraum, warnt PickShade und zeigt die nächste Farbe, die passt.

Bekomme ich gleichzeitig andere Formate?

Ja. Alle anderen Formate, darunter OKLCH, Display P3, Tailwind, SwiftUI, Flutter und Android, stehen unter dem Ergebnis und lassen sich mit einem Klick kopieren.

Ist dieser Konverter kostenlos?

Ja. Er ist kostenlos, braucht keine Anmeldung und läuft komplett in deinem Browser.