Ressourcen: 256 Graustufen in HTML - Kombination von Farbwert #4a4a4a und Farbe gray75

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 #4a4a4a			Schriftfarbe gray75
Detail	:	Hintergrund #4a4a4a	Detail	:	Schrift gray75
Farbwert	:	#4a4a4a	Farbe	:	gray75
Farbe	:	gray74	Farbwert	:	#4b4b4b
HTML	:	#4a4a4a	HTML	:	gray75
HTML (Wert)	:	#4a4a4a	HTML (Wert)	:	#4b4b4b
CSS	:	#4a4a4a	CSS	:	gray75
CSS (Wert)	:	#4a4a4a	CSS (Wert)	:	#4b4b4b
CSS (kürzest)	:	#4a4a4a	CSS (kürzest)	:	#4b4b4b
CSS (RGB)	:	rgb(74,74,74)	CSS (RGB)	:	rgb(75,75,75)
CSS (%RGB)	:	rgb(29%,29%,29%)	CSS (%RGB)	:	rgb(29%,29%,29%)

Verlauf Hintergrundfarbwert #4a4a4a nach Schriftfarbe gray75
#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4b4b4b
#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4b4b4b

Kombination von #4a4a4a und gray75
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. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				Die Ähnlichkeit der Farben gray75 und #4a4a4a beträgt 95.16%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 4.84%. Auf Hintergrund #4a4a4a ist gray75 ungeeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind geeignet.

Hintergrundfarbwert #4a4a4a				Schriftfarbe gray75
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#4a4a4a	#4a4a4a	#4a4a4a	#4a4a4a	#4b4b4b	#4b4b4b	#4b4b4b	#4b4b4b
#636363	#636363	#3f3f3f	#3f3f3f	#646464	#646464	#404040	#404040
#7d7d7d	#7d7d7d	#343434	#343434	#7e7e7e	#7e7e7e	#353535	#353535
#979797	#979797	#2a2a2a	#2a2a2a	#989898	#989898	#2a2a2a	#2a2a2a
#b1b1b1	#b1b1b1	#1f1f1f	#1f1f1f	#b1b1b1	#b1b1b1	#202020	#202020
#cbcbcb	#cbcbcb	#151515	#151515	#cbcbcb	#cbcbcb	#151515	#151515
#e5e5e5	#e5e5e5	#0a0a0a	#0a0a0a	#e5e5e5	#e5e5e5	#0a0a0a	#0a0a0a
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #4a4a4a und Farbe gray75

Wechsel der Textfarbe bei Hover von Befehl acronym

Die Textfarbe soll sich von Farbwert #4a4a4a auf Farbe gray75 ändern, wenn man mit der Maus auf <acronym> zeigt. Bereiten wir zunächst eine Formatierung von <acronym> in Farbwert #4a4a4a vor.

Für dieses Beispiel legen wir Farbwert #4a4a4a als Textfarbe von <acronym> fest. Die Hintergrundfarbe behalten wir bei, setzen jedoch die Schriftart auf verdana und verkleinern die Schriftgröße auf 93%:

<style type="text/css"><!--
  acronym { 
    font-size:93%; 
    color:#4a4a4a; 
    font-family:verdana;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Textfarbe auf gray75 gesetzt wird.

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

Möglichkeiten vom HTML-Tag <acronym>.

Füllen und Umranden bei HTML-Befehl input

Bei diesem Beispiel umranden wir <input> mit einem 3 Pixel dicken, einfallenden Rahmen in Farbe gray75 . Die Hintergrundfarbe für <input> färben wir mit Farbwert #4a4a4a. Das geht in HTML kaum. Deshalb formatieren wir hier mit CSS.

<style type="text/css"><!--
  input { border:3px inset gray75; background-color:#4a4a4a; }
//-->
</style>

Weiteres zum Thema input erfahren Sie in Formulare in HTML. Möglichkeiten des hier genutzten Befehl input lesen Sie in der HTML Referenz unter <input>.