Ressourcen: 256 Graustufen in HTML - Kombination von Farbwert #f4f4f4 und Farbe gray179

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).

Hintergrundfarbwert #f4f4f4			Schriftfarbe gray179
Detail	:	Hintergrund #f4f4f4	Detail	:	Schrift gray179
Farbwert	:	#f4f4f4	Farbe	:	gray179
Farbe	:	gray244	Farbwert	:	#b3b3b3
HTML	:	#f4f4f4	HTML	:	gray179
HTML (Wert)	:	#f4f4f4	HTML (Wert)	:	#b3b3b3
CSS	:	#f4f4f4	CSS	:	gray179
CSS (Wert)	:	#f4f4f4	CSS (Wert)	:	#b3b3b3
CSS (kürzest)	:	#f4f4f4	CSS (kürzest)	:	#b3b3b3
CSS (RGB)	:	rgb(244,244,244)	CSS (RGB)	:	rgb(179,179,179)
CSS (%RGB)	:	rgb(95%,95%,95%)	CSS (%RGB)	:	rgb(70%,70%,70%)

Verlauf Hintergrundfarbwert #f4f4f4 nach Schriftfarbe gray179
#f4f4f4	#eaeaea	#e1e1e1	#d8d8d8	#cecece	#c5c5c5	#bcbcbc	#b3b3b3
#f4f4f4	#eaeaea	#e1e1e1	#d8d8d8	#cecece	#c5c5c5	#bcbcbc	#b3b3b3

Kombination von #f4f4f4 und gray179
Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				gray179 ist nicht als Schriftfarbe auf Hintergrund #f4f4f4 geeignet, da sich sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit von gray179 und #f4f4f4 ergibt sich zu 90.92%. Die Lesbarkeit dieser Kombination liegt damit bei 9.08%.

Hintergrundfarbwert #f4f4f4				Schriftfarbe gray179
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#f4f4f4	#f4f4f4	#f4f4f4	#f4f4f4	#b3b3b3	#b3b3b3	#b3b3b3	#b3b3b3
#f5f5f5	#f5f5f5	#d1d1d1	#d1d1d1	#bdbdbd	#bdbdbd	#999999	#999999
#f7f7f7	#f7f7f7	#aeaeae	#aeaeae	#c8c8c8	#c8c8c8	#7f7f7f	#7f7f7f
#f8f8f8	#f8f8f8	#8b8b8b	#8b8b8b	#d3d3d3	#d3d3d3	#666666	#666666
#fafafa	#fafafa	#686868	#686868	#dedede	#dedede	#4c4c4c	#4c4c4c
#fbfbfb	#fbfbfb	#454545	#454545	#e9e9e9	#e9e9e9	#333333	#333333
#fdfdfd	#fdfdfd	#222222	#222222	#f4f4f4	#f4f4f4	#191919	#191919
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiel zur Kombination von Farbwert #f4f4f4 und Farbe gray179

Wechsel der Textfarbe bei Hover bei Befehl td

Die Textfarbe soll sich von Farbwert #f4f4f4 auf Farbe gray179 ändern, wenn man mit der Maus auf <td> zeigt. Wir bereiten zunächst die Formatierung von <td> in Farbwert #f4f4f4 vor.

Wir legen hier Farbwert #f4f4f4 als Textfarbe von <td> fest. Zwar verändern wir die Hintergrundfarbe nicht, ändern jedoch die Schriftart auf sans-serif und verkleinern die Schriftgröße auf 96%:

<style type="text/css"><!--
  td { 
    font-family: sans-serif; 
    font-size: 96%; 
    color: #f4f4f4;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Berührung mit der Maus die Textfarbe auf gray179 ändert.

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

Mehr zum Thema können Sie in Tabellen in HTML finden. Weiteres zum hier gezeigten HTML-Befehl td lesen Sie in der HTML Referenz unter <td>.