Ressourcen: 16 Graustufen in HTML - Kombination von Farbe gray34 und Farbwert #333333

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.

Hintergrundfarbe gray34			Schriftfarbwert #333333
Detail	:	Hintergrund gray34	Detail	:	Schrift #333333
Farbe	:	gray34	Farbwert	:	#333333
Farbwert	:	#222222	Farbe	:	gray51
HTML	:	gray34	HTML	:	#333333
HTML (Wert)	:	#222222	HTML (Wert)	:	#333333
CSS	:	gray34	CSS	:	#333333
CSS (Wert)	:	#222222	CSS (Wert)	:	#333333
CSS (kürzest)	:	#222	CSS (kürzest)	:	#333
CSS (RGB)	:	rgb(34,34,34)	CSS (RGB)	:	rgb(51,51,51)
CSS (%RGB)	:	rgb(13%,13%,13%)	CSS (%RGB)	:	rgb(20%,20%,20%)

Verlauf Hintergrundfarbe gray34 nach Schriftfarbwert #333333
#222222	#242424	#262626	#292929	#2b2b2b	#2e2e2e	#303030	#333333
#222222	#242424	#262626	#292929	#2b2b2b	#2e2e2e	#303030	#333333

Kombination von gray34 und #333333
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. Cras vestibulum tristique erat, ac interdum justo cursus in.				Die Ähnlichkeit von #333333 und gray34 beträgt 94.00%. Die Lesbarkeit dieser Farbkombination liegt damit bei 6.00%. Auf Hintergrund gray34 ist #333333 ungeeignet. Die Unterschiede in der Helligkeit und Farbe sind nicht ausreichend.

Hintergrundfarbe gray34				Schriftfarbwert #333333
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#222222	#222222	#222222	#222222	#333333	#333333	#333333	#333333
#414141	#414141	#1d1d1d	#1d1d1d	#505050	#505050	#2b2b2b	#2b2b2b
#616161	#616161	#181818	#181818	#6d6d6d	#6d6d6d	#242424	#242424
#808080	#808080	#131313	#131313	#8a8a8a	#8a8a8a	#1d1d1d	#1d1d1d
#a0a0a0	#a0a0a0	#0e0e0e	#0e0e0e	#a7a7a7	#a7a7a7	#151515	#151515
#bfbfbf	#bfbfbf	#090909	#090909	#c4c4c4	#c4c4c4	#0e0e0e	#0e0e0e
#dfdfdf	#dfdfdf	#040404	#040404	#e1e1e1	#e1e1e1	#070707	#070707
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gray34 und Farbwert #333333

Wechsel der Hintergrundfarbe bei Hover bei Befehl td

Die Hintergrundfarbe soll sich von Farbe gray34 auf Farbwert #333333 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <td> in Farbe gray34 vor.

Für dieses Beispiel legen wir Farbe gray34 als Hintergrundfarbe von <td> fest und setzen die Größe der Schrift auf 114%:

<style type="text/css"><!--
  td { 
    font-size:114%; 
    background-color:gray34;
  }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Hintergrundfarbe auf #333333 geändert wird.

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

Weiteres zu td können Sie in Tabellen in HTML lesen. Einzelheiten des hier gezeigten Tag <td>.

Hintergrund/Text-Kombination von HTML-Befehl fieldset

Hier ändern wir die Textfarbe von <fieldset> auf Farbwert #333333 und die Hintergrundfarbe von <fieldset> auf Farbe gray34. Die Schriftart setzen wir auf courier new und setzen die Schriftgröße auf 11pt.

<style type="text/css"><!--
  fieldset { 
    color:#333; 
    font-size:11pt; 
    background-color:gray34; 
    font-family:courier new;
  }
//-->
</style>

Weiteres zu fieldset lesen Sie in Formulare in HTML. Zur Beschreibung vom Tag <fieldset>.