Ressourcen: 256 Graustufen in HTML - Kombination von Farbwert #bbbbbb und Farbwert #4e4e4e

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 #bbbbbb			Schriftfarbwert #4e4e4e
Detail	:	Hintergrund #bbbbbb	Detail	:	Schrift #4e4e4e
Farbwert	:	#bbbbbb	Farbwert	:	#4e4e4e
Farbe	:	gray187	Farbe	:	gray78
HTML	:	#bbbbbb	HTML	:	#4e4e4e
HTML (Wert)	:	#bbbbbb	HTML (Wert)	:	#4e4e4e
CSS	:	#bbbbbb	CSS	:	#4e4e4e
CSS (Wert)	:	#bbbbbb	CSS (Wert)	:	#4e4e4e
CSS (kürzest)	:	#bbb	CSS (kürzest)	:	#4e4e4e
CSS (RGB)	:	rgb(187,187,187)	CSS (RGB)	:	rgb(78,78,78)
CSS (%RGB)	:	rgb(73%,73%,73%)	CSS (%RGB)	:	rgb(30%,30%,30%)

Verlauf Hintergrundfarbwert #bbbbbb nach Schriftfarbwert #4e4e4e
#bbbbbb	#ababab	#9b9b9b	#8c8c8c	#7c7c7c	#6d6d6d	#5d5d5d	#4e4e4e
#bbbbbb	#ababab	#9b9b9b	#8c8c8c	#7c7c7c	#6d6d6d	#5d5d5d	#4e4e4e

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

Hintergrundfarbwert #bbbbbb				Schriftfarbwert #4e4e4e
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#bbbbbb	#bbbbbb	#bbbbbb	#bbbbbb	#4e4e4e	#4e4e4e	#4e4e4e	#4e4e4e
#c4c4c4	#c4c4c4	#a0a0a0	#a0a0a0	#676767	#676767	#424242	#424242
#cecece	#cecece	#858585	#858585	#808080	#808080	#373737	#373737
#d8d8d8	#d8d8d8	#6a6a6a	#6a6a6a	#999999	#999999	#2c2c2c	#2c2c2c
#e1e1e1	#e1e1e1	#505050	#505050	#b3b3b3	#b3b3b3	#212121	#212121
#ebebeb	#ebebeb	#353535	#353535	#cccccc	#cccccc	#161616	#161616
#f5f5f5	#f5f5f5	#1a1a1a	#1a1a1a	#e5e5e5	#e5e5e5	#0b0b0b	#0b0b0b
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #bbbbbb und Farbwert #4e4e4e

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag a

Ein Link wird mit Befehl <a> erzeugt. Diesen können Sie hervorheben und farblich gestalten.

Die Hintergrundfarbe soll sich von Farbwert #bbbbbb auf Farbwert #4e4e4e ändern, wenn man mit der Maus auf <a> zeigt. Bereiten wir zunächst eine Formatierung von <a> in Farbwert #bbbbbb vor.

Wir ändern für dieses Beispiel bei <a> die Hintergrundfarbe auf Farbwert #bbbbbb und setzen die Größe der Schrift auf 85S%:

<style type="text/css"><!--
  a { 
    background-color:#bbb; 
    font-size:85S%;
  }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Hintergrundfarbe auf #4e4e4e gesetzt wird.

<style type="text/css"><!--
  a:hover { 
    background-color:#4e4e4e;
  }
//-->
</style>

Weiteres zu a können Sie in Verweise und Protokolle in HTML lesen. Möglichkeiten vom HTML-Tag <a>.

Füllen und Umranden von Tag q

Für dieses Beispiel umranden wir <q> mit einem einfallenden, 2 Punkte dicken Rahmen in Farbwert #4e4e4e . Den Hintergrund von <q> setzen wir auf Farbwert #bbbbbb. In HTML geht das nicht. Deshalb formatieren wir hier mit CSS.

<style type="text/css"><!--
  q { 
    border-width: 2pt; 
    border-color: #4e4e4e; 
    border-style: inset; 
    background-color: #bbb;
  }
//-->
</style>

Die Beschreibung des HTML-Tag q lesen Sie in der HTML Referenz unter <q>.