Ressourcen: 256 Graustufen in HTML - Kombination von Farbe gray88 und Farbe gray11

Graustufen enthalten natürlich alle 16 Graustufen und insbesondere die unbunten Grundfarben Schwarz und Weiß.

Um 256 Graustufen in HTML bzw. CSS zu erzeugen, wählen wir Farbwerte rr, gg und bb mit Werten von 0 bis 255 (d.h. hexadezimal 00 bis ff).

Hintergrundfarbe gray88			Schriftfarbe gray11
Detail	:	Hintergrund gray88	Detail	:	Schrift gray11
Farbe	:	gray88	Farbe	:	gray11
Farbwert	:	#585858	Farbwert	:	#0b0b0b
HTML	:	gray88	HTML	:	gray11
HTML (Wert)	:	#585858	HTML (Wert)	:	#0b0b0b
CSS	:	gray88	CSS	:	gray11
CSS (Wert)	:	#585858	CSS (Wert)	:	#0b0b0b
CSS (kürzest)	:	#585858	CSS (kürzest)	:	#0b0b0b
CSS (RGB)	:	rgb(88,88,88)	CSS (RGB)	:	rgb(11,11,11)
CSS (%RGB)	:	rgb(34%,34%,34%)	CSS (%RGB)	:	rgb(4%,4%,4%)

Verlauf Hintergrundfarbe gray88 nach Schriftfarbe gray11
#585858	#4d4d4d	#424242	#373737	#2c2c2c	#212121	#161616	#0b0b0b
#585858	#4d4d4d	#424242	#373737	#2c2c2c	#212121	#161616	#0b0b0b

Kombination von gray88 und gray11
Cras vestibulum tristique erat, ac interdum justo cursus in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit von gray11 und gray88 ergibt sich zu 86.83%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 13.17%. Auf Hintergrund gray88 ist gray11 ungeeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind geeignet.

Hintergrundfarbe gray88				Schriftfarbe gray11
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#585858	#585858	#585858	#585858	#0b0b0b	#0b0b0b	#0b0b0b	#0b0b0b
#6f6f6f	#6f6f6f	#4b4b4b	#4b4b4b	#2d2d2d	#2d2d2d	#090909	#090909
#878787	#878787	#3e3e3e	#3e3e3e	#505050	#505050	#070707	#070707
#9f9f9f	#9f9f9f	#323232	#323232	#737373	#737373	#060606	#060606
#b7b7b7	#b7b7b7	#252525	#252525	#969696	#969696	#040404	#040404
#cfcfcf	#cfcfcf	#191919	#191919	#b9b9b9	#b9b9b9	#030303	#030303
#e7e7e7	#e7e7e7	#0c0c0c	#0c0c0c	#dcdcdc	#dcdcdc	#010101	#010101
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gray88 und Farbe gray11

Füllen und Umranden von HTML-Tag td

Hier umranden wir <td> mit einem 4 Punkte dicken, gefurchten Rahmen in Farbe gray11 . Die Hintergrundfarbe für <td> färben wir mit Farbe gray88. Dies geht in HTML nicht. Wir verwenden deshalb CSS.

<style type="text/css"><!--
  td { 
    border-color: gray11; 
    border-style: groove; 
    background-color: gray88; 
    border-width: 4pt;
  }
//-->
</style>

Mehr zu td können Sie in Tabellen in HTML nachsehen. Einzelheiten des Tag <td>.

Wechsel der Textfarbe bei Hover von HTML-Tag tfoot

Die Textfarbe soll sich von Farbe gray88 auf Farbe gray11 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <tfoot> in Farbe gray88 vor.

Zum Beispiel legen wir Farbe gray88 als Textfarbe von <tfoot> fest. Die Hintergrundfarbe lassen wir unverändert, ändern jedoch die Schriftart auf arial. Die Schriftgröße vergrößern wir auf 127%:

<style type="text/css"><!--
  tfoot { 
    color: gray88; 
    font-family: arial; 
    font-size: 127%;
  }
//-->
</style>

Nun stellen wir ein, dass bei Hover die Textfarbe auf gray11 gesetzt wird.

<style type="text/css"><!--
  tfoot: hover { 
    color: gray11;
  }
//-->
</style>

Mehr zum Thema tfoot können Sie in Tabellen in HTML finden. Weiteres zum Tag <tfoot>.