Kurzerklärung
Es werden aus den drei Farbwerten für Rot, Grün und Blau und dem Wert für die Transparenz die jeweiligen Ganzzahlen ermittelt und in die folgende Schreibweise umgeformt: rgba (RRR, GGG, BBB, Transparenz). Wenn wir die Farbe Rot umwandeln, wird sie wie folgt angegeben #FF0000FF. Die ersten beiden Werte stehen für den roten, die mittleren beiden Werte für den grünen und die dritten Werte für den blauen Anteil der Farbe. Die beiden letzten Werte geben den Grad der Transparenz an.
Die ersten sechs Werte werden jeweils in eine Ganzzahl umgewandelt. Aus FF wird 255, aus 00 wird 0. Damit ergibt sich der Farbwert in RGBA-Schreibweise mit rgba (255, 0, 0, 1).
Berechnungsbeispiel
Wir werden am Beispiel der Farbe orange mit einer Transparenz von 7F eine Umrechnung von hex zu rgba beschreiben.
Ausgangswert ist die Farbe im Headezimalcode:
Hex = #FFA5007F
Dieser Code wird auf die jeweiligen Farben Rot, Grün, Blau und den Wert für die Transparenz aufgeteilt:
Rot = FF
Grün = A5
Blau = 00
Transparenz = 7F
Die Farbwerte müssen nun von Hexadezimal in das Dezimalsystem umgerechnet werden. Dazu muss man wissen, dass die Werte von Hexadezimalzahlen von 0 bis 9 für die Zahl 0 bis 9 stehen und danach die Buchstaben A oder a für 10, B oder b für 11, C oder c für 12, D oder d für 13, E oder e für 14 und F oder f für 15. Das bedeutet in unserem Beispiel, dass wir zu Begin den Wert für Rot, FF umwandeln müssen. Das rechte F steht für 15 und das linke F, was man mit F0 wiedergeben kann, berechnet man, indem man den Einzelwert für F (15) mit dem Systemwert (16) multipliziert. Demzufolge ergibt F0 im Dezimalsystem 240. Die Summe aus den beiden Teilwerten ergibt für FF ergibt den Dezimalwert 255. Beim Wert für die Transparenz gibt es eine Besonderheit. Hier wird in der RGBA-Schreibweise der Wert als Dezimalwert zwischen 0 und 1 angegeben, wobei 0 für vollständige Transparenz und 1 für Intransparenz steht. Dieser Wert ergibt sich, indem der berechnete Wert der Transparenz durch den Wert 255 geteilt und gerundet wird. Daraus ergeben sich die folgenden Berechnungen:
Rot = F0 + F
Rot = 15 * 16 + 15
Rot = 255
Grün = A0 + 5
Grün = 10 * 16 + 5
Grün = 165
Blau = 00 + 0
Blau = 0 * 16 + 0
Blau = 0
Transparenz = 70 + F
Transparenz = (7 * 16 + 15) / 255
Transparenz = 0.5
Um das Ergebnis unserer Berechnung zu erhalten, müssen die berechneten Dezimalwerte nun in die RGB-Schreibweise rgb (rot, grün, blau) gebracht werden:
RGBA = rgba (255, 165, 0, 0.5)