Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #bc8f8f und Farbwert #a9a9a9

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen Farbwerten, die einem bestimmten Schema folgen, definierte man noch 120 Werte und ordnete ihnen Namen zu.

Hintergrundfarbwert #bc8f8f			Schriftfarbwert #a9a9a9
Detail	:	Hintergrund #bc8f8f	Detail	:	Schrift #a9a9a9
Farbwert	:	#bc8f8f	Farbwert	:	#a9a9a9
Farbe	:	rosybrown	Farbe	:	darkgray
HTML	:	#bc8f8f	HTML	:	#a9a9a9
HTML (Wert)	:	#bc8f8f	HTML (Wert)	:	#a9a9a9
CSS	:	#bc8f8f	CSS	:	#a9a9a9
CSS (Wert)	:	#bc8f8f	CSS (Wert)	:	#a9a9a9
CSS (kürzest)	:	#bc8f8f	CSS (kürzest)	:	#a9a9a9
CSS (RGB)	:	rgb(188,143,143)	CSS (RGB)	:	rgb(169,169,169)
CSS (%RGB)	:	rgb(73%,56%,56%)	CSS (%RGB)	:	rgb(66%,66%,66%)

Verlauf Hintergrundfarbwert #bc8f8f nach Schriftfarbwert #a9a9a9
#bc8f8f	#b99292	#b69696	#b39a9a	#b19d9d	#aea1a1	#aba5a5	#a9a9a9
#bc8f8f	#b99292	#b69696	#b39a9a	#b19d9d	#aea1a1	#aba5a5	#a9a9a9

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

Hintergrundfarbwert #bc8f8f				Schriftfarbwert #a9a9a9
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#bc8f8f	#bc8f8f	#bc8f8f	#bc8f8f	#a9a9a9	#a9a9a9	#a9a9a9	#a9a9a9
#c59f9f	#c59f9f	#a17a7a	#a17a7a	#b5b5b5	#b5b5b5	#909090	#909090
#cfafaf	#cfafaf	#866666	#866666	#c1c1c1	#c1c1c1	#787878	#787878
#d8bfbf	#d8bfbf	#6b5151	#6b5151	#cdcdcd	#cdcdcd	#606060	#606060
#e2cfcf	#e2cfcf	#503d3d	#503d3d	#dadada	#dadada	#484848	#484848
#ebdfdf	#ebdfdf	#352828	#352828	#e6e6e6	#e6e6e6	#303030	#303030
#f5efef	#f5efef	#1a1414	#1a1414	#f2f2f2	#f2f2f2	#181818	#181818
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #bc8f8f und Farbwert #a9a9a9

Wechsel der Umrandung bei Hover von HTML-Tag pre

Die Rahmenfarbe soll sich von Farbwert #bc8f8f auf Farbwert #a9a9a9 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Formatierung von <pre> in Farbwert #bc8f8f vor.

In diesem Beispiel umranden wir <pre> mit einem 3 Pixel dicken, gezahnten Rahmen in Farbwert #bc8f8f.

<style type="text/css"><!--
  pre { border:3px ridge #bc8f8f; }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Rahmenfarbe auf #a9a9a9 gesetzt wird.

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

Mehr zum Thema pre erfahren Sie in Blockorientierte Elemente in HTML. Beschreibung des hier gezeigten HTML-Befehl <pre>.

Text- und Unterstreichungsfarben bei HTML-Befehl abbr

Hier ändern wir die Textfarbe von <abbr> auf Farbwert #a9a9a9. Die Schriftart setzen wir auf monospace. Die Schriftgröße ändern wir auf 9px. Wir unterstreichen den Inhalt von <abbr> mit Hilfe eines herausstehenden Rahmens mit 3 Pixel Dicke in Farbwert #bc8f8f. Mit HTML ist das nicht möglich. Wir nutzen daher CSS.

<style type="text/css"><!--
  abbr { 
    border-bottom-style:outset; 
    font-size:9px; 
    border-bottom-color:#bc8f8f; 
    color:#a9a9a9; 
    font-family:monospace; 
    border-bottom-width:3px;
  }
//-->
</style>

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

Einzelheiten vom hier genutzten Befehl abbr sind in der HTML Referenz bei <abbr> ausführlich beschrieben.