Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #696969 und Farbwert #b22222

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen, einem bestimmten Schema folgenden, Farbwerten, definierte man noch 120 Werte und ordnete ihnen Namen zu. Zusammen mit den 17 Standard-HTML-Farben, die ebenfalls Namen haben, ergeben sich so 137 HTML Farbnamen.

Hintergrundfarbwert #696969			Schriftfarbwert #b22222
Detail	:	Hintergrund #696969	Detail	:	Schrift #b22222
Farbwert	:	#696969	Farbwert	:	#b22222
Farbe	:	dimgray	Farbe	:	firebrick
HTML	:	#696969	HTML	:	#b22222
HTML (Wert)	:	#696969	HTML (Wert)	:	#b22222
CSS	:	#696969	CSS	:	#b22222
CSS (Wert)	:	#696969	CSS (Wert)	:	#b22222
CSS (kürzest)	:	#696969	CSS (kürzest)	:	#b22222
CSS (RGB)	:	rgb(105,105,105)	CSS (RGB)	:	rgb(178,34,34)
CSS (%RGB)	:	rgb(41%,41%,41%)	CSS (%RGB)	:	rgb(69%,13%,13%)

Verlauf Hintergrundfarbwert #696969 nach Schriftfarbwert #b22222
#696969	#735e5e	#7d5454	#884a4a	#924040	#9d3636	#a72c2c	#b22222
#696969	#735e5e	#7d5454	#884a4a	#924040	#9d3636	#a72c2c	#b22222

Kombination von #696969 und #b22222
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.				Die Ähnlichkeit von #b22222 und #696969 ergibt sich zu 94.21%. Die Lesbarkeit dieser Farbkombination liegt damit bei 5.79%. #b22222 ist nicht als Schriftfarbe auf Hintergrund #696969 geeignet, da sich die Helligkeit und Farben zu ähnlich sind.

Hintergrundfarbwert #696969				Schriftfarbwert #b22222
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#696969	#696969	#696969	#696969	#b22222	#b22222	#b22222	#b22222
#7e7e7e	#7e7e7e	#5a5a5a	#5a5a5a	#bd4141	#bd4141	#981d1d	#981d1d
#939393	#939393	#4b4b4b	#4b4b4b	#c86161	#c86161	#7f1818	#7f1818
#a9a9a9	#a9a9a9	#3c3c3c	#3c3c3c	#d38080	#d38080	#651313	#651313
#bebebe	#bebebe	#2d2d2d	#2d2d2d	#dea0a0	#dea0a0	#4c0e0e	#4c0e0e
#d4d4d4	#d4d4d4	#1e1e1e	#1e1e1e	#e9bfbf	#e9bfbf	#320909	#320909
#e9e9e9	#e9e9e9	#0f0f0f	#0f0f0f	#f4dfdf	#f4dfdf	#190404	#190404
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #696969 und Farbwert #b22222

Füllen und Umranden von HTML-Tag acronym

In diesem Beispiel umranden wir <acronym> mit einem gepunkteten, 1 Pixel dicken Rahmen in Farbwert #b22222 . Den Hintergrund von <acronym> färben wir entsprechend mit Farbwert #696969. Dies ist mit HTML kaum möglich. Deshalb verwenden wir dafür CSS.

<style type="text/css"><!--
  acronym { 
    border-width:1px; 
    border-style:dotted; 
    border-color:#b22222; 
    background-color:#696969;
  }
//-->
</style>

Weiteres zum Befehl acronym ist in der HTML Referenz unter <acronym> ausführlich gezeigt.

Wechsel der Hintergrundfarbe bei Hover mit HTML-Befehl label

Die Hintergrundfarbe soll sich von Farbwert #696969 auf Farbwert #b22222 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <label> in Farbwert #696969 vor.

Wir legen für dieses Beispiel bei <label> die Hintergrundfarbe auf Farbwert #696969 fest und setzen die Größe der Schrift auf 128%.

<style type="text/css"><!--
  label { 
    background-color: #696969; 
    font-size: 128%;
  }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Hintergrundfarbe auf #b22222 geändert wird.

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

Weiteres zum Thema label können Sie in Formulare in HTML nachsehen. Der Tag label ist in der HTML Referenz bei <label> genau zusammengestellt.