Ressourcen: 16 Graustufen in HTML - Kombination von Farbwert #999999 und Farbwert #888888

Graustufen enthalten insbesondere die unbunten Grundfarben Schwarz und Weiß.

Um 16 Graustufen in HTML bzw. CSS zu erzeugen, wählen wir Farbwerte rr, gg und bb mit Werten von 0 bis 15 (d.h. hexadezimal 0 bis f) für r, g und b.

Hintergrundfarbwert #999999			Schriftfarbwert #888888
Detail	:	Hintergrund #999999	Detail	:	Schrift #888888
Farbwert	:	#999999	Farbwert	:	#888888
Farbe	:	gray153	Farbe	:	gray136
HTML	:	#999999	HTML	:	#888888
HTML (Wert)	:	#999999	HTML (Wert)	:	#888888
CSS	:	#999999	CSS	:	#888888
CSS (Wert)	:	#999999	CSS (Wert)	:	#888888
CSS (kürzest)	:	#999	CSS (kürzest)	:	#888
CSS (RGB)	:	rgb(153,153,153)	CSS (RGB)	:	rgb(136,136,136)
CSS (%RGB)	:	rgb(60%,60%,60%)	CSS (%RGB)	:	rgb(53%,53%,53%)

Verlauf Hintergrundfarbwert #999999 nach Schriftfarbwert #888888
#999999	#969696	#949494	#919191	#8f8f8f	#8c8c8c	#8a8a8a	#888888
#999999	#969696	#949494	#919191	#8f8f8f	#8c8c8c	#8a8a8a	#888888

Kombination von #999999 und #888888
Cras vestibulum tristique erat, ac interdum justo cursus in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras id velit ante.				#888888 ist nicht als Schriftfarbe auf Hintergrund #999999 geeignet. Die Helligkeit und Farben sind zu ähnlich. Die Ähnlichkeit von #888888 und #999999 beträgt 94.08%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 5.92%.

Hintergrundfarbwert #999999				Schriftfarbwert #888888
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#999999	#999999	#999999	#999999	#888888	#888888	#888888	#888888
#a7a7a7	#a7a7a7	#838383	#838383	#999999	#999999	#747474	#747474
#b6b6b6	#b6b6b6	#6d6d6d	#6d6d6d	#aaaaaa	#aaaaaa	#616161	#616161
#c4c4c4	#c4c4c4	#575757	#575757	#bbbbbb	#bbbbbb	#4d4d4d	#4d4d4d
#d3d3d3	#d3d3d3	#414141	#414141	#cccccc	#cccccc	#3a3a3a	#3a3a3a
#e1e1e1	#e1e1e1	#2b2b2b	#2b2b2b	#dddddd	#dddddd	#262626	#262626
#f0f0f0	#f0f0f0	#151515	#151515	#eeeeee	#eeeeee	#131313	#131313
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #999999 und Farbwert #888888

Hintergrund/Text-Kombination mit HTML-Tag h5

Mit HTML-Tag <h5> wird eine Überschrift der 5. Stufe erzeugt. Diese kann man farblich gestalten.

Hier ändern wir die Textfarbe von <h5> auf Farbwert #888888 und die Hintergrundfarbe von <h5> auf Farbwert #999999. Die Schriftart setzen wir auf arial. Die Schriftgröße erhöhen wir auf 110%.

<style type="text/css"><!--
  h5 { 
    font-size: 110%; 
    color: #888888; 
    background-color: #999999; 
    font-family: arial;
  }
//-->
</style>

Weiteres zum Thema erfahren Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten des HTML-Befehl h5 erfahren Sie in der HTML Referenz unter <h5>.

Wechsel der Umrandung bei Hover bei HTML-Tag hr

Die Rahmenfarbe soll sich von Farbwert #999999 auf Farbwert #888888 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <hr> in Farbwert #999999 vor.

In diesem Beispiel umranden wir <hr> mit einem 3 Pixel dicken, gezahnten Rahmen in Farbwert #999999.

<style type="text/css"><!--
  hr { border:3px ridge #999999; }
//-->
</style>

Nun stellen wir ein, dass bei Berührung mit der Maus die Rahmenfarbe auf #888888 gesetzt wird.

<style type="text/css"><!--
  hr: hover { 
    border-color: #888;
  }
//-->
</style>

Weiteres zum Thema können Sie in Grundlegende Gestaltungselemente in HTML finden. Mehr zum hier genutzten Tag <hr>.