Farben in html-Code

Farben in html-Code

Farben dienen der visuellen Darstellung. Es gibt Farben für Hinter- und Vordergrundfarben des Dokumentes, Hintergrundfarben in Tabellen, Schriftfarben für Textabschnitte, usw.

Html-Farben können als Farbnamen (z.B. yellow) oder mit den (r,g,b)-Komponenten für rot,grün,blau angegeben werden. Z.B. kennzeichnet #ffff00 die Farbe gelb (Kurzschreibweise #ff0). Beispiele:

In div-Tag, wie z.B.:

 <div style="background:#FFFF00;"> ... </div>

Im Style-Tag, wie z.B.:

<style type="text/css">
body { background-color:#E0E0E0; color: #000000:}
.rot { background-color:#FF0000; }
.gelb { background-color:#FFFF00; }
</style>

Eine CSS-Style-Klasse .gelb kann wie z.B. wie folgt aussehen:

<style type="text/css">
.gelb {color: #FFFF00;}
.gelb {color: #FF0;}
.gelb {color: rgb(255,255,0);}
.gelb {color: rgb(100%,100%,0%);}
</style>

Verwendung etwa

<div class="gelb;"> ... </div>

Anzahl der Farben

Typische Verwendung mit den Hex-Zeichen: #rrggbb:

Die Anzahl der darstellbaren Farben hängt von den Möglichkeiten und der Einstellung (mode) des Gerätes (Grafikkarte) ab.

1 Byte kann die Zahlen (dez) 0,1,2,3,4,5,6,7,8,9,10,11,12,... 255 darstellen.
1 Byte kann die Zahlen (hexa) 00, 01, 02, 09, 0A,0B,0C,0D,0E,0F,10, ...,FF darstellen.
3 Byte entsprechen 24 Bit und damit 2^24 = 16 777 216 unterschiedene Farben.

Wieviel verschiedene Farben lassen sich deklarieren?
... als websicher Farben: 216 = 6^3 (rr,gg,bb = 00,33,66,99,cc,ff)
... in der Kurzangabe #rgb: 4 096 = 2^12 (r,g,b = 0,1,2,3,..., e,f)
... in der darstellung #rrggbb: 16 777 216 = 2^24 (r,g,b = 0,1,2,3,..., e,f)

Farbtabelle (rot-hex: 00)

#0000

#0011

#0022

#0033

#0044

#0055

#0066

#0077

#0088

#0099

#00aa

#00bb

#00cc

#00dd

#00ee

#00ff

Farbtabelle (rot-hex: 11)

#1100

#1111

#1122

#1133

#1144

#1155

#1166

#1177

#1188

#1199

#11aa

#11bb

#11cc

#11dd

#11ee

#11ff

Farbtabelle (rot-hex: 22)

#2200

#2211

#2222

#2233

#2244

#2255

#2266

#2277

#2288

#2299

#22aa

#22bb

#22cc

#22dd

#22ee

#22ff

Farbtabelle (rot-hex: 33)

#3300

#3311

#3322

#3333

#3344

#3355

#3366

#3377

#3388

#3399

#33aa

#33bb

#33cc

#33dd

#33ee

#33ff

Farbtabelle (rot-hex: 44)

#4400

#4411

#4422

#4433

#4444

#4455

#4466

#4477

#4488

#4499

#44aa

#44bb

#44cc

#44dd

#44ee

#44ff

Farbtabelle (rot-hex: 55)

#5500

#5511

#5522

#5533

#5544

#5555

#5566

#5577

#5588

#5599

#55aa

#55bb

#55cc

#55dd

#55ee

#55ff

Farbtabelle (rot-hex: 66)

#6600

#6611

#6622

#6633

#6644

#6655

#6666

#6677

#6688

#6699

#66aa

#66bb

#66cc

#66dd

#66ee

#66ff

Farbtabelle (rot-hex: 77)

#7700

#7711

#7722

#7733

#7744

#7755

#7766

#7777

#7788

#7799

#77aa

#77bb

#77cc

#77dd

#77ee

#77ff

Farbtabelle (rot-hex: 88)

#8800

#8811

#8822

#8833

#8844

#8855

#8866

#8877

#8888

#8899

#88aa

#88bb

#88cc

#88dd

#88ee

#88ff

Farbtabelle (rot-hex: 99)

#9900

#9911

#9922

#9933

#9944

#9955

#9966

#9977

#9988

#9999

#99aa

#99bb

#99cc

#99dd

#99ee

#99ff

Farbtabelle (rot-hex: aa)

#aa00

#aa11

#aa22

#aa33

#aa44

#aa55

#aa66

#aa77

#aa88

#aa99

#aaaa

#aabb

#aacc

#aadd

#aaee

#aaff

Farbtabelle (rot-hex: bb)

#bb00

#bb11

#bb22

#bb33

#bb44

#bb55

#bb66

#bb77

#bb88

#bb99

#bbaa

#bbbb

#bbcc

#bbdd

#bbee

#bbff

Farbtabelle (rot-hex: cc)

#cc00

#cc11

#cc22

#cc33

#cc44

#cc55

#cc66

#cc77

#cc88

#cc99

#ccaa

#ccbb

#cccc

#ccdd

#ccee

#ccff

Farbtabelle (rot-hex: dd)

#dd00

#dd11

#dd22

#dd33

#dd44

#dd55

#dd66

#dd77

#dd88

#dd99

#ddaa

#ddbb

#ddcc

#dddd

#ddee

#ddff

Farbtabelle (rot-hex: ee)

#ee00

#ee11

#ee22

#ee33

#ee44

#ee55

#ee66

#ee77

#ee88

#ee99

#eeaa

#eebb

#eecc

#eedd

#eeee

#eeff

Farbtabelle (rot-hex: ff)

#ff00

#ff11

#ff22

#ff33

#ff44

#ff55

#ff66

#ff77

#ff88

#ff99

#ffaa

#ffbb

#ffcc

#ffdd

#ffee

#ffff