Ressourcen: 256 Graustufen in HTML - Kombination von Farbe silver und Farbwert #525252

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 silver			Schriftfarbwert #525252
Detail	:	Hintergrund silver	Detail	:	Schrift #525252
Farbe	:	silver	Farbwert	:	#525252
Farbwert	:	#c0c0c0	Farbe	:	gray82
HTML	:	silver	HTML	:	#525252
HTML (Wert)	:	#c0c0c0	HTML (Wert)	:	#525252
CSS	:	silver	CSS	:	#525252
CSS (Wert)	:	#c0c0c0	CSS (Wert)	:	#525252
CSS (kürzest)	:	#c0c0c0	CSS (kürzest)	:	#525252
CSS (RGB)	:	rgb(192,192,192)	CSS (RGB)	:	rgb(82,82,82)
CSS (%RGB)	:	rgb(75%,75%,75%)	CSS (%RGB)	:	rgb(32%,32%,32%)

Verlauf Hintergrundfarbe silver nach Schriftfarbwert #525252
#c0c0c0	#b0b0b0	#a0a0a0	#909090	#818181	#717171	#616161	#525252
#c0c0c0	#b0b0b0	#a0a0a0	#909090	#818181	#717171	#616161	#525252

Kombination von silver und #525252
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 vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante.				Die Ähnlichkeit der Farben #525252 und silver ergibt sich zu 79.55%. Die Lesbarkeit dieser Farbkombination liegt damit bei 20.45%. #525252 eignet sich nicht als Schriftfarbe auf Hintergrund silver. Die Unterschiede in der Helligkeit und Farbe sind nicht ausreichend.

Hintergrundfarbe silver				Schriftfarbwert #525252
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#c0c0c0	#c0c0c0	#c0c0c0	#c0c0c0	#525252	#525252	#525252	#525252
#c9c9c9	#c9c9c9	#a4a4a4	#a4a4a4	#6a6a6a	#6a6a6a	#464646	#464646
#d2d2d2	#d2d2d2	#898989	#898989	#838383	#838383	#3a3a3a	#3a3a3a
#dbdbdb	#dbdbdb	#6d6d6d	#6d6d6d	#9c9c9c	#9c9c9c	#2e2e2e	#2e2e2e
#e4e4e4	#e4e4e4	#525252	#525252	#b4b4b4	#b4b4b4	#232323	#232323
#ededed	#ededed	#363636	#363636	#cdcdcd	#cdcdcd	#171717	#171717
#f6f6f6	#f6f6f6	#1b1b1b	#1b1b1b	#e6e6e6	#e6e6e6	#0b0b0b	#0b0b0b
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe silver und Farbwert #525252

Füllen und Umranden mit Tag strike

Hier umranden wir <strike> mit einem . Den Hintergrund von <strike> setzen wir entsprechend auf Farbe silver. Mit HTML ist das nicht möglich. Daher formatieren wir mit CSS.

<style type="text/css"><!--
  strike { border:1pt dotted #525252; background-color:silver; }
//-->
</style>

Weiteres zum Thema strike lesen Sie in Text in HTML. Möglichkeiten des Tag <strike>.

Wechsel der Unterstreichung bei Hover von Befehl del

Die Unterstreichungsfarbe soll sich von Farbe silver auf Farbwert #525252 ändern, wenn man mit der Maus auf <del> zeigt. Wir bereiten zunächst die Darstellung von <del> in Farbe silver vor.

Beispielsweise unterstreichen wir <del> mit Hilfe eines doppelten Rahmens mit 2 Pixel Dicke in Farbe silver.

<style type="text/css"><!--
  del { 
    border-bottom-width:2px; 
    border-bottom-color:silver; 
    border-bottom-style:double;
  }
//-->
</style>

Nun fordern wir, dass bei Mausberührung die Unterstreichungsfarbe auf #525252 gesetzt wird.

<style type="text/css"><!--
  del:hover { 
    border-bottom-color:#525252;
  }
//-->
</style>

Die Idee ist, verschiedene Formatierungen für Inhalt und Unterstreichung zu nutzen. Manchmal sehen Sie diesen Effekt bei Hyperlinks. Der Text ist in einer Farbe. Die Unterstreichung in einer anderen. Hierbei handelt es sich aber nicht um eine "wirkliche" Unterstreichung, der Text hat gar keine Unterstreichung. Sie wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Weiteres zum hier gezeigten Tag <del>.