Ressourcen: 256 Graustufen in HTML - Kombination von Farbe gray und Farbwert #dcdcdc

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 gray			Schriftfarbwert #dcdcdc
Detail	:	Hintergrund gray	Detail	:	Schrift #dcdcdc
Farbe	:	gray	Farbwert	:	#dcdcdc
Farbwert	:	#808080	Farbe	:	gray220
HTML	:	gray	HTML	:	#dcdcdc
HTML (Wert)	:	#808080	HTML (Wert)	:	#dcdcdc
CSS	:	gray	CSS	:	#dcdcdc
CSS (Wert)	:	#808080	CSS (Wert)	:	#dcdcdc
CSS (kürzest)	:	#808080	CSS (kürzest)	:	#dcdcdc
CSS (RGB)	:	rgb(128,128,128)	CSS (RGB)	:	rgb(220,220,220)
CSS (%RGB)	:	rgb(50%,50%,50%)	CSS (%RGB)	:	rgb(86%,86%,86%)

Verlauf Hintergrundfarbe gray nach Schriftfarbwert #dcdcdc
#808080	#8d8d8d	#9a9a9a	#a7a7a7	#b4b4b4	#c1c1c1	#cecece	#dcdcdc
#808080	#8d8d8d	#9a9a9a	#a7a7a7	#b4b4b4	#c1c1c1	#cecece	#dcdcdc

Kombination von gray und #dcdcdc
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna.				Die Ähnlichkeit der Farben #dcdcdc und gray ergibt sich zu 86.29%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 13.71%. Auf Hintergrund gray ist #dcdcdc ungeeignet. Die Unterschiede in der Helligkeit und Farbe sind nicht ausreichend.

Hintergrundfarbe gray				Schriftfarbwert #dcdcdc
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#808080	#808080	#808080	#808080	#dcdcdc	#dcdcdc	#dcdcdc	#dcdcdc
#929292	#929292	#6d6d6d	#6d6d6d	#e1e1e1	#e1e1e1	#bcbcbc	#bcbcbc
#a4a4a4	#a4a4a4	#5b5b5b	#5b5b5b	#e6e6e6	#e6e6e6	#9d9d9d	#9d9d9d
#b6b6b6	#b6b6b6	#494949	#494949	#ebebeb	#ebebeb	#7d7d7d	#7d7d7d
#c8c8c8	#c8c8c8	#363636	#363636	#f0f0f0	#f0f0f0	#5e5e5e	#5e5e5e
#dadada	#dadada	#242424	#242424	#f5f5f5	#f5f5f5	#3e3e3e	#3e3e3e
#ececec	#ececec	#121212	#121212	#fafafa	#fafafa	#1f1f1f	#1f1f1f
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gray und Farbwert #dcdcdc

Hintergrund/Text-Kombination bei Tag caption

Hier ändern wir die Textfarbe von <caption> auf Farbwert #dcdcdc und die Hintergrundfarbe von <caption> auf Farbe gray. Als Schriftart wählen wir verdana und setzen die Schriftgröße auf 9pt.

<style type="text/css"><!--
  caption { 
    color:#dcdcdc; 
    font-size:9pt; 
    background-color:gray; 
    font-family:verdana;
  }
//-->
</style>

Weiteres zu caption können Sie in Tabellen in HTML erfahren. Möglichkeiten vom Befehl caption erfahren Sie in der HTML Referenz unter <caption>.

Wechsel der Textfarbe bei Hover von HTML-Tag h3

Eine Überschrift wird mit Tag <h3> erzeugt. Diese kann man farblich gestalten und hervorheben.

Die Textfarbe soll sich von Farbe gray auf Farbwert #dcdcdc ändern, wenn man mit der Maus auf <h3> zeigt. Wir bereiten zunächst eine Darstellung von <h3> in Farbe gray vor.

Wir legen zum Beispiel die Textfarbe von <h3> auf Farbe gray fest. Die Hintergrundfarbe ändern wir nicht, ändern jedoch die Schriftart auf sans-serif.

<style type="text/css"><!--
  h3 { 
    color:gray; 
    font-family:sans-serif;
  }
//-->
</style>

Jetzt stellen wir ein, dass bei Mausberührung die Textfarbe auf #dcdcdc geändert wird.

<style type="text/css"><!--
  h3: hover { 
    color: #dcdcdc;
  }
//-->
</style>

Weiteres zum Thema lesen Sie in Grundlegende Gestaltungselemente in HTML. Der hier verwendete HTML-Befehl h3 ist in der HTML Referenz bei <h3> ausführlich zusammengestellt.