Ressourcen: 256 Graustufen in HTML - Kombination von Farbwert #afafaf und Farbe gray138

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 #afafaf			Schriftfarbe gray138
Detail	:	Hintergrund #afafaf	Detail	:	Schrift gray138
Farbwert	:	#afafaf	Farbe	:	gray138
Farbe	:	gray175	Farbwert	:	#8a8a8a
HTML	:	#afafaf	HTML	:	gray138
HTML (Wert)	:	#afafaf	HTML (Wert)	:	#8a8a8a
CSS	:	#afafaf	CSS	:	gray138
CSS (Wert)	:	#afafaf	CSS (Wert)	:	#8a8a8a
CSS (kürzest)	:	#afafaf	CSS (kürzest)	:	#8a8a8a
CSS (RGB)	:	rgb(175,175,175)	CSS (RGB)	:	rgb(138,138,138)
CSS (%RGB)	:	rgb(68%,68%,68%)	CSS (%RGB)	:	rgb(54%,54%,54%)

Verlauf Hintergrundfarbwert #afafaf nach Schriftfarbe gray138
#afafaf	#a9a9a9	#a4a4a4	#9f9f9f	#999999	#949494	#8f8f8f	#8a8a8a
#afafaf	#a9a9a9	#a4a4a4	#9f9f9f	#999999	#949494	#8f8f8f	#8a8a8a

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

Hintergrundfarbwert #afafaf				Schriftfarbe gray138
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#afafaf	#afafaf	#afafaf	#afafaf	#8a8a8a	#8a8a8a	#8a8a8a	#8a8a8a
#bababa	#bababa	#969696	#969696	#9a9a9a	#9a9a9a	#767676	#767676
#c5c5c5	#c5c5c5	#7d7d7d	#7d7d7d	#ababab	#ababab	#626262	#626262
#d1d1d1	#d1d1d1	#646464	#646464	#bcbcbc	#bcbcbc	#4e4e4e	#4e4e4e
#dcdcdc	#dcdcdc	#4b4b4b	#4b4b4b	#cccccc	#cccccc	#3b3b3b	#3b3b3b
#e8e8e8	#e8e8e8	#323232	#323232	#dddddd	#dddddd	#272727	#272727
#f3f3f3	#f3f3f3	#191919	#191919	#eeeeee	#eeeeee	#131313	#131313
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #afafaf und Farbe gray138

Hintergrund/Text-Kombination bei HTML-Tag colgroup

Für dieses Beispiel ändern wir die Textfarbe von <colgroup> auf Farbe gray138 und die Hintergrundfarbe von <colgroup> auf Farbwert #afafaf. Als Schriftart wählen wir verdana. Die Schriftgröße ändern wir auf 10px.

<style type="text/css"><!--
  colgroup { 
    font-family: verdana; 
    color: gray138; 
    font-size: 10px; 
    background-color: #afafaf;
  }
//-->
</style>

Mehr zu colgroup finden Sie in Tabellen in HTML. Die Beschreibung des hier verwendeten HTML-Tag colgroup finden Sie in der HTML Referenz unter <colgroup>.

Wechsel der Textfarbe bei Hover mit Befehl var

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

Wir legen in diesem Beispiel die Textfarbe von <var> auf Farbwert #afafaf fest und ändern die Größe der Schrift auf 13px.

<style type="text/css"><!--
  var { 
    font-size: 13px; 
    color: #afafaf;
  }
//-->
</style>

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

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

Weiteres zum Thema var können Sie in Text in HTML finden. Einzelheiten vom hier genutzten Befehl var finden Sie in der HTML Referenz unter <var>.