Ressourcen: 16 Graustufen in HTML - Kombination von Farbwert #dddddd und Farbwert #111111

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.

Hintergrundfarbwert #dddddd			Schriftfarbwert #111111
Detail	:	Hintergrund #dddddd	Detail	:	Schrift #111111
Farbwert	:	#dddddd	Farbwert	:	#111111
Farbe	:	gray221	Farbe	:	gray17
HTML	:	#dddddd	HTML	:	#111111
HTML (Wert)	:	#dddddd	HTML (Wert)	:	#111111
CSS	:	#dddddd	CSS	:	#111111
CSS (Wert)	:	#dddddd	CSS (Wert)	:	#111111
CSS (kürzest)	:	#ddd	CSS (kürzest)	:	#111
CSS (RGB)	:	rgb(221,221,221)	CSS (RGB)	:	rgb(17,17,17)
CSS (%RGB)	:	rgb(86%,86%,86%)	CSS (%RGB)	:	rgb(6%,6%,6%)

Verlauf Hintergrundfarbwert #dddddd nach Schriftfarbwert #111111
#dddddd	#bfbfbf	#a2a2a2	#858585	#686868	#4b4b4b	#2e2e2e	#111111
#dddddd	#bfbfbf	#a2a2a2	#858585	#686868	#4b4b4b	#2e2e2e	#111111

Kombination von #dddddd und #111111
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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.				Die Ähnlichkeit von #111111 und #dddddd ergibt sich zu 33.80%. Die Lesbarkeit dieser Farbkombination liegt damit bei 66.20%. #111111 eignet sich als Schriftfarbe auf Hintergrund #dddddd. Helligkeitsunterschied und Unterschied in den Farben sind in Ordnung.

Hintergrundfarbwert #dddddd				Schriftfarbwert #111111
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#dddddd	#dddddd	#dddddd	#dddddd	#111111	#111111	#111111	#111111
#e1e1e1	#e1e1e1	#bdbdbd	#bdbdbd	#333333	#333333	#0e0e0e	#0e0e0e
#e6e6e6	#e6e6e6	#9d9d9d	#9d9d9d	#555555	#555555	#0c0c0c	#0c0c0c
#ebebeb	#ebebeb	#7e7e7e	#7e7e7e	#777777	#777777	#090909	#090909
#f0f0f0	#f0f0f0	#5e5e5e	#5e5e5e	#999999	#999999	#070707	#070707
#f5f5f5	#f5f5f5	#3f3f3f	#3f3f3f	#bbbbbb	#bbbbbb	#040404	#040404
#fafafa	#fafafa	#1f1f1f	#1f1f1f	#dddddd	#dddddd	#020202	#020202
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #dddddd und Farbwert #111111

Wechsel der Textfarbe bei Hover bei HTML-Tag dd

Die Textfarbe soll sich von Farbwert #dddddd auf Farbwert #111111 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Formatierung von <dd> in Farbwert #dddddd vor.

Wir legen z.B. die Textfarbe von <dd> auf Farbwert #dddddd fest und setzen die Schriftgröße auf 9px.

<style type="text/css"><!--
  dd { 
    font-size: 9px; 
    color: #dddddd;
  }
//-->
</style>

Jetzt stellen wir ein, dass bei Berührung mit der Maus die Textfarbe auf #111111 geändert wird.

<style type="text/css"><!--
  dd: hover { 
    color: #111111;
  }
//-->
</style>

Weiteres zum Thema erfahren Sie in Listen und Glossare in HTML. Weiteres zum Befehl <dd>.

Wechsel der Umrandung bei Hover von HTML-Tag img

Die Rahmenfarbe soll sich von Farbwert #dddddd auf Farbwert #111111 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <img> in Farbwert #dddddd vor.

In diesem Beispiel umranden wir <img> mit einem 4 Pixel dicken, herausstehenden Rahmen in Farbwert #dddddd.

<style type="text/css"><!--
  img { border:4px outset #ddd; }
//-->
</style>

Nun fordern wir, dass bei Mausberührung die Rahmenfarbe auf #111111 gesetzt wird.

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

Weiteres zum Thema erfahren Sie in Grafik in HTML. Die Beschreibung des Tag img erfahren Sie in der HTML Referenz unter <img>.