Ressourcen: 256 Graustufen in HTML - Kombination von Farbwert #585858 und Farbwert #545454

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 #585858			Schriftfarbwert #545454
Detail	:	Hintergrund #585858	Detail	:	Schrift #545454
Farbwert	:	#585858	Farbwert	:	#545454
Farbe	:	gray88	Farbe	:	gray84
HTML	:	#585858	HTML	:	#545454
HTML (Wert)	:	#585858	HTML (Wert)	:	#545454
CSS	:	#585858	CSS	:	#545454
CSS (Wert)	:	#585858	CSS (Wert)	:	#545454
CSS (kürzest)	:	#585858	CSS (kürzest)	:	#545454
CSS (RGB)	:	rgb(88,88,88)	CSS (RGB)	:	rgb(84,84,84)
CSS (%RGB)	:	rgb(34%,34%,34%)	CSS (%RGB)	:	rgb(32%,32%,32%)

Verlauf Hintergrundfarbwert #585858 nach Schriftfarbwert #545454
#585858	#575757	#565656	#565656	#555555	#555555	#545454	#545454
#585858	#575757	#565656	#565656	#555555	#555555	#545454	#545454

Kombination von #585858 und #545454
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				Die Ähnlichkeit der Farben #545454 und #585858 beträgt 94.93%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 5.07%. #545454 ist nicht als Schriftfarbe auf Hintergrund #585858 geeignet, weil die Unterschiede in der Helligkeit und Farbe zu gering sind.

Hintergrundfarbwert #585858				Schriftfarbwert #545454
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#585858	#585858	#585858	#585858	#545454	#545454	#545454	#545454
#6f6f6f	#6f6f6f	#4b4b4b	#4b4b4b	#6c6c6c	#6c6c6c	#484848	#484848
#878787	#878787	#3e3e3e	#3e3e3e	#848484	#848484	#3c3c3c	#3c3c3c
#9f9f9f	#9f9f9f	#323232	#323232	#9d9d9d	#9d9d9d	#303030	#303030
#b7b7b7	#b7b7b7	#252525	#252525	#b5b5b5	#b5b5b5	#242424	#242424
#cfcfcf	#cfcfcf	#191919	#191919	#cecece	#cecece	#181818	#181818
#e7e7e7	#e7e7e7	#0c0c0c	#0c0c0c	#e6e6e6	#e6e6e6	#0c0c0c	#0c0c0c
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #585858 und Farbwert #545454

Wechsel der Hintergrundfarbe bei Hover mit HTML-Befehl tr

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

Als Beispiel legen wir Farbwert #585858 als Hintergrundfarbe von <tr> fest.

<style type="text/css"><!--
  tr { 
    background-color: #585858;
  }
//-->
</style>

Nun fordern wir, dass sich bei Mausberührung die Hintergrundfarbe zu #545454 ändert.

<style type="text/css"><!--
  tr:hover { 
    background-color:#545454;
  }
//-->
</style>

Weiteres zum Thema können Sie in Tabellen in HTML erfahren. Einzelheiten vom hier genutzten HTML-Befehl <tr>.

Füllen und Umranden mit HTML-Tag blockquote

In diesem Beispiel umranden wir <blockquote> mit einem 3 Pixel dicken, gepunkteten Rahmen in Farbwert #545454 . Den Hintergrund von <blockquote> setzen wir entsprechend auf Farbwert #585858. Mit HTML geht das kaum. Wir verwenden daher CSS.

<style type="text/css"><!--
  blockquote { 
    border-color: #545454; 
    border-width: 3px; 
    border-style: dotted; 
    background-color: #585858;
  }
//-->
</style>

Weiteres zu blockquote finden Sie in Blockorientierte Elemente in HTML. Einzelheiten des hier verwendeten HTML-Tag blockquote finden Sie in der HTML Referenz unter <blockquote>.