Ressourcen: 256 Graustufen in HTML - Kombination von Farbwert #fefefe und Farbe gray244

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

Verlauf Hintergrundfarbwert #fefefe nach Schriftfarbe gray244
#fefefe	#fcfcfc	#fbfbfb	#f9f9f9	#f8f8f8	#f6f6f6	#f5f5f5	#f4f4f4
#fefefe	#fcfcfc	#fbfbfb	#f9f9f9	#f8f8f8	#f6f6f6	#f5f5f5	#f4f4f4

Kombination von #fefefe und gray244
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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.				gray244 ist nicht als Schriftfarbe auf Hintergrund #fefefe geeignet, da weder der Helligkeitsunterschied noch der Farbunterschied gross genug sind. Die Ähnlichkeit der Farben gray244 und #fefefe beträgt 94.81%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 5.19%.

Hintergrundfarbwert #fefefe				Schriftfarbe gray244
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#fefefe	#fefefe	#fefefe	#fefefe	#f4f4f4	#f4f4f4	#f4f4f4	#f4f4f4
#fefefe	#fefefe	#d9d9d9	#d9d9d9	#f5f5f5	#f5f5f5	#d1d1d1	#d1d1d1
#fefefe	#fefefe	#b5b5b5	#b5b5b5	#f7f7f7	#f7f7f7	#aeaeae	#aeaeae
#fefefe	#fefefe	#919191	#919191	#f8f8f8	#f8f8f8	#8b8b8b	#8b8b8b
#fefefe	#fefefe	#6c6c6c	#6c6c6c	#fafafa	#fafafa	#686868	#686868
#fefefe	#fefefe	#484848	#484848	#fbfbfb	#fbfbfb	#454545	#454545
#fefefe	#fefefe	#242424	#242424	#fdfdfd	#fdfdfd	#222222	#222222
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #fefefe und Farbe gray244

Wechsel der Textfarbe bei Hover mit Tag h3

Eine Überschrift der 3. Stufe setzen Sie mit Befehl <h3>. Diese kann man farblich gestalten und hervorheben.

Die Textfarbe soll sich von Farbwert #fefefe auf Farbe gray244 ändern, wenn man mit der Maus auf <h3> zeigt. Bereiten wir zunächst eine Darstellung von <h3> in Farbwert #fefefe vor.

In diesem Beispiel ändern wir die Textfarbe von <h3> auf Farbwert #fefefe:

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

Jetzt fordern wir, dass bei Hover die Textfarbe auf gray244 geändert wird.

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

Mehr zu h3 können Sie in Grundlegende Gestaltungselemente in HTML nachsehen. Mehr zum hier verwendeten Befehl h3 ist in der HTML Referenz bei <h3> ausführlich gezeigt.

Füllen und Umranden bei Befehl code

In diesem Beispiel umranden wir <code> mit einem . Den Hintergrund von <code> setzen wir auf Farbwert #fefefe. In HTML ist dies kaum machbar. Wir nutzen daher CSS.

<style type="text/css"><!--
  code { border:5pt outset gray244; background-color:#fefefe; }
//-->
</style>

Mehr zum Thema code lesen Sie in Text in HTML. Die Beschreibung vom HTML-Tag code erfahren Sie in der HTML Referenz unter <code>.