Ressourcen: 256 Graustufen in HTML - Kombination von Farbe gray5 und Farbe gray254

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 gray5			Schriftfarbe gray254
Detail	:	Hintergrund gray5	Detail	:	Schrift gray254
Farbe	:	gray5	Farbe	:	gray254
Farbwert	:	#050505	Farbwert	:	#fefefe
HTML	:	gray5	HTML	:	gray254
HTML (Wert)	:	#050505	HTML (Wert)	:	#fefefe
CSS	:	gray5	CSS	:	gray254
CSS (Wert)	:	#050505	CSS (Wert)	:	#fefefe
CSS (kürzest)	:	#050505	CSS (kürzest)	:	#fefefe
CSS (RGB)	:	rgb(5,5,5)	CSS (RGB)	:	rgb(254,254,254)
CSS (%RGB)	:	rgb(1%,1%,1%)	CSS (%RGB)	:	rgb(99%,99%,99%)

Verlauf Hintergrundfarbe gray5 nach Schriftfarbe gray254
#050505	#282828	#4c4c4c	#6f6f6f	#939393	#b6b6b6	#dadada	#fefefe
#050505	#282828	#4c4c4c	#6f6f6f	#939393	#b6b6b6	#dadada	#fefefe

Kombination von gray5 und gray254
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in. 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.				gray254 eignet sich als Schriftfarbe auf Hintergrund gray5, da die Unterschiede in Helligkeit und Farbe gut sind. Die Ähnlichkeit von gray254 und gray5 ergibt sich zu 3.77%. Die Lesbarkeit dieser Kombination bewerte ich mit 96.23%.

Hintergrundfarbe gray5				Schriftfarbe gray254
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#050505	#050505	#050505	#050505	#fefefe	#fefefe	#fefefe	#fefefe
#282828	#282828	#040404	#040404	#fefefe	#fefefe	#d9d9d9	#d9d9d9
#4c4c4c	#4c4c4c	#030303	#030303	#fefefe	#fefefe	#b5b5b5	#b5b5b5
#707070	#707070	#020202	#020202	#fefefe	#fefefe	#919191	#919191
#939393	#939393	#020202	#020202	#fefefe	#fefefe	#6c6c6c	#6c6c6c
#b7b7b7	#b7b7b7	#010101	#010101	#fefefe	#fefefe	#484848	#484848
#dbdbdb	#dbdbdb	#000000	#000000	#fefefe	#fefefe	#242424	#242424
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gray5 und Farbe gray254

Wechsel der Textfarbe bei Hover von Befehl thead

Die Textfarbe soll sich von Farbe gray5 auf Farbe gray254 ändern, wenn man mit der Maus auf <thead> zeigt. Wir bereiten zunächst eine Formatierung von <thead> in Farbe gray5 vor.

Wir legen in diesem Beispiel bei <thead> die Textfarbe auf Farbe gray5 fest und ändern die Größe der Schrift auf 10pt:

<style type="text/css"><!--
  thead { 
    color: gray5; 
    font-size: 10pt;
  }
//-->
</style>

Nun fordern wir, dass bei Hover die Textfarbe auf gray254 geändert wird.

<style type="text/css"><!--
  thead: hover { 
    color: gray254;
  }
//-->
</style>

Weiteres zum Thema thead können Sie in Tabellen in HTML lesen. Möglichkeiten vom hier verwendeten Befehl thead sind in der HTML Referenz unter <thead> genau beschrieben.

Füllen und Umranden von Befehl center

In diesem Beispiel umranden wir <center> mit einem . Den Hintergrund von <center> setzen wir auf Farbe gray5. Mit HTML geht das nicht. Wir nutzen daher CSS zur Formatierung.

<style type="text/css"><!--
  center { border:1pt dashed gray254; background-color:gray5; }
//-->
</style>

Mehr zum Thema center können Sie in Grundlegende Gestaltungselemente in HTML nachsehen. Die Beschreibung vom hier genutzten HTML-Tag center erfahren Sie in der HTML Referenz unter <center>.