Ressourcen: 16 Graustufen in HTML - Kombination von Farbe gray204 und Farbwert #999999

Graustufen enthalten insbesondere die unbunten Grundfarben Schwarz und Weiß.

Um 16 Graustufen in HTML bzw. CSS zu erzeugen, wählen wir Farbwerte rr, gg und bb mit Werten von 0 bis 15 (d.h. hexadezimal 0 bis f) für r, g und b.

Hintergrundfarbe gray204			Schriftfarbwert #999999
Detail	:	Hintergrund gray204	Detail	:	Schrift #999999
Farbe	:	gray204	Farbwert	:	#999999
Farbwert	:	#cccccc	Farbe	:	gray153
HTML	:	gray204	HTML	:	#999999
HTML (Wert)	:	#cccccc	HTML (Wert)	:	#999999
CSS	:	gray204	CSS	:	#999999
CSS (Wert)	:	#cccccc	CSS (Wert)	:	#999999
CSS (kürzest)	:	#ccc	CSS (kürzest)	:	#999
CSS (RGB)	:	rgb(204,204,204)	CSS (RGB)	:	rgb(153,153,153)
CSS (%RGB)	:	rgb(80%,80%,80%)	CSS (%RGB)	:	rgb(60%,60%,60%)

Verlauf Hintergrundfarbe gray204 nach Schriftfarbwert #999999
#cccccc	#c4c4c4	#bdbdbd	#b6b6b6	#aeaeae	#a7a7a7	#a0a0a0	#999999
#cccccc	#c4c4c4	#bdbdbd	#b6b6b6	#aeaeae	#a7a7a7	#a0a0a0	#999999

Kombination von gray204 und #999999
Cras vestibulum tristique erat, ac interdum justo cursus in. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				#999999 eignet sich nicht als Schriftfarbe auf Hintergrund gray204. Sowohl Helligkeit als auch die Farben sind sich zu ähnlich. Die Ähnlichkeit der Farben #999999 und gray204 ergibt sich zu 91.55%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 8.45%.

Hintergrundfarbe gray204				Schriftfarbwert #999999
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#cccccc	#cccccc	#cccccc	#cccccc	#999999	#999999	#999999	#999999
#d3d3d3	#d3d3d3	#aeaeae	#aeaeae	#a7a7a7	#a7a7a7	#838383	#838383
#dadada	#dadada	#919191	#919191	#b6b6b6	#b6b6b6	#6d6d6d	#6d6d6d
#e1e1e1	#e1e1e1	#747474	#747474	#c4c4c4	#c4c4c4	#575757	#575757
#e9e9e9	#e9e9e9	#575757	#575757	#d3d3d3	#d3d3d3	#414141	#414141
#f0f0f0	#f0f0f0	#3a3a3a	#3a3a3a	#e1e1e1	#e1e1e1	#2b2b2b	#2b2b2b
#f7f7f7	#f7f7f7	#1d1d1d	#1d1d1d	#f0f0f0	#f0f0f0	#151515	#151515
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe gray204 und Farbwert #999999

Wechsel der Umrandung bei Hover von HTML-Befehl a

Einen Link erzeugen Sie mit Tag <a> und kann farblich gestaltet werden.

Die Rahmenfarbe soll sich von Farbe gray204 auf Farbwert #999999 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <a> in Farbe gray204 vor.

In diesem Beispiel umranden wir <a> mit einem 2 Pixel dicken, gepunkteten Rahmen in Farbe gray204.

<style type="text/css"><!--
  a { border:2px dotted gray204; }
//-->
</style>

Nun fordern wir, dass sich bei Berührung mit der Maus die Rahmenfarbe auf #999999 ändert.

<style type="text/css"><!--
  a: hover { 
    border-color: #999;
  }
//-->
</style>

Weiteres zu a können Sie in Verweise und Protokolle in HTML erfahren. Der HTML-Befehl a ist in der HTML Referenz bei <a> beschrieben.

Text- und Unterstreichungsfarben bei Befehl ins

Hier ändern wir die Textfarbe von <ins> auf Farbwert #999999. Die Schriftart setzen wir auf monospace und erhöhen die Schriftgröße auf 118%. Wir unterstreichen den Inhalt von <ins> mit Hilfe eines gepunkteten Rahmens mit 2 Punkte Dicke in Farbe gray204. Mit HTML ist dies kaum möglich. Wir verwenden deshalb CSS.

<style type="text/css"><!--
  ins { 
    color: #999; 
    font-family: monospace; 
    font-size: 118%; 
    border-bottom: 2pt dotted gray204;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben.

Zur Beschreibung vom Tag <ins>.