Ressourcen: 256 Graustufen in HTML - Kombination von Farbe gray131 und Farbwert #e5e5e5

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 gray131			Schriftfarbwert #e5e5e5
Detail	:	Hintergrund gray131	Detail	:	Schrift #e5e5e5
Farbe	:	gray131	Farbwert	:	#e5e5e5
Farbwert	:	#838383	Farbe	:	gray229
HTML	:	gray131	HTML	:	#e5e5e5
HTML (Wert)	:	#838383	HTML (Wert)	:	#e5e5e5
CSS	:	gray131	CSS	:	#e5e5e5
CSS (Wert)	:	#838383	CSS (Wert)	:	#e5e5e5
CSS (kürzest)	:	#838383	CSS (kürzest)	:	#e5e5e5
CSS (RGB)	:	rgb(131,131,131)	CSS (RGB)	:	rgb(229,229,229)
CSS (%RGB)	:	rgb(51%,51%,51%)	CSS (%RGB)	:	rgb(89%,89%,89%)

Verlauf Hintergrundfarbe gray131 nach Schriftfarbwert #e5e5e5
#838383	#919191	#9f9f9f	#adadad	#bbbbbb	#c9c9c9	#d7d7d7	#e5e5e5
#838383	#919191	#9f9f9f	#adadad	#bbbbbb	#c9c9c9	#d7d7d7	#e5e5e5

Kombination von gray131 und #e5e5e5
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras id velit ante.				Die Ähnlichkeit der Farben #e5e5e5 und gray131 beträgt 85.67%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 14.33%. #e5e5e5 eignet sich nicht als Schriftfarbe auf Hintergrund gray131, weil sich sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbe gray131				Schriftfarbwert #e5e5e5
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#838383	#838383	#838383	#838383	#e5e5e5	#e5e5e5	#e5e5e5	#e5e5e5
#949494	#949494	#707070	#707070	#e8e8e8	#e8e8e8	#c4c4c4	#c4c4c4
#a6a6a6	#a6a6a6	#5d5d5d	#5d5d5d	#ececec	#ececec	#a3a3a3	#a3a3a3
#b8b8b8	#b8b8b8	#4a4a4a	#4a4a4a	#f0f0f0	#f0f0f0	#828282	#828282
#c9c9c9	#c9c9c9	#383838	#383838	#f3f3f3	#f3f3f3	#626262	#626262
#dbdbdb	#dbdbdb	#252525	#252525	#f7f7f7	#f7f7f7	#414141	#414141
#ededed	#ededed	#121212	#121212	#fbfbfb	#fbfbfb	#202020	#202020
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gray131 und Farbwert #e5e5e5

Text- und Unterstreichungsfarben bei HTML-Befehl dfn

Bei diesem Beispiel ändern wir die Textfarbe von <dfn> auf Farbwert #e5e5e5 und lassen die Hintergrundfarbe unverändert. Die Schriftart setzen wir auf sans-serif. Die Schriftgröße vergrößern wir auf 123%. Wir unterstreichen den Inhalt von <dfn> mit Hilfe eines doppelten Rahmens mit 2 Punkte Dicke in Farbe gray131. Das geht in HTML kaum. Daher formatieren wir mit CSS.

<style type="text/css"><!--
  dfn { 
    color:#e5e5e5; 
    font-size:123%; 
    border-bottom-style:double; 
    font-family:sans-serif; 
    border-bottom-color:gray131; 
    border-bottom-width:2pt;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben.

Mehr zu dfn können Sie in Text in HTML nachlesen. Mehr zum hier gezeigten HTML-Tag dfn ist in der HTML Referenz bei <dfn> genau zusammengestellt.

Wechsel der Textfarbe bei Hover von Befehl h5

Eine Überschrift der 5. Stufe erzeugt man mit Tag <h5>. Diese kann man farblich gestalten.

Die Textfarbe soll sich von Farbe gray131 auf Farbwert #e5e5e5 ändern, wenn man mit der Maus auf <h5> zeigt. Wir bereiten zunächst eine Formatierung von <h5> in Farbe gray131 vor.

In diesem Beispiel ändern wir bei <h5> die Textfarbe auf Farbe gray131 und setzen die Schriftgröße auf 9px.

<style type="text/css"><!--
  h5 { 
    font-size:9px; 
    color:gray131;
  }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Textfarbe auf #e5e5e5 gesetzt wird.

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

Mehr zu h5 erfahren Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten des HTML-Befehl <h5>.