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

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 #ffa07a			Schriftfarbwert #bc8f8f
Detail	:	Hintergrund #ffa07a	Detail	:	Schrift #bc8f8f
Farbwert	:	#ffa07a	Farbwert	:	#bc8f8f
Farbe	:	lightsalmon	Farbe	:	rosybrown
HTML	:	#ffa07a	HTML	:	#bc8f8f
HTML (Wert)	:	#ffa07a	HTML (Wert)	:	#bc8f8f
CSS	:	#ffa07a	CSS	:	#bc8f8f
CSS (Wert)	:	#ffa07a	CSS (Wert)	:	#bc8f8f
CSS (kürzest)	:	#ffa07a	CSS (kürzest)	:	#bc8f8f
CSS (RGB)	:	rgb(255,160,122)	CSS (RGB)	:	rgb(188,143,143)
CSS (%RGB)	:	rgb(100%,62%,47%)	CSS (%RGB)	:	rgb(73%,56%,56%)

Verlauf Hintergrundfarbwert #ffa07a nach Schriftfarbwert #bc8f8f
#ffa07a	#f59d7d	#eb9b80	#e29883	#d89686	#cf9389	#c5918c	#bc8f8f
#ffa07a	#f59d7d	#eb9b80	#e29883	#d89686	#cf9389	#c5918c	#bc8f8f

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

Hintergrundfarbwert #ffa07a				Schriftfarbwert #bc8f8f
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffa07a	#ffa07a	#ffa07a	#ffa07a	#bc8f8f	#bc8f8f	#bc8f8f	#bc8f8f
#ffad8d	#ffad8d	#da8968	#da8968	#c59f9f	#c59f9f	#a17a7a	#a17a7a
#ffbba0	#ffbba0	#b67257	#b67257	#cfafaf	#cfafaf	#866666	#866666
#ffc8b3	#ffc8b3	#915b45	#915b45	#d8bfbf	#d8bfbf	#6b5151	#6b5151
#ffd6c6	#ffd6c6	#6d4434	#6d4434	#e2cfcf	#e2cfcf	#503d3d	#503d3d
#ffe3d9	#ffe3d9	#482d22	#482d22	#ebdfdf	#ebdfdf	#352828	#352828
#fff1ec	#fff1ec	#241611	#241611	#f5efef	#f5efef	#1a1414	#1a1414
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ffa07a und Farbwert #bc8f8f

Wechsel der Umrandung bei Hover von Befehl p

Die Rahmenfarbe soll sich von Farbwert #ffa07a auf Farbwert #bc8f8f ändern, wenn man mit der Maus auf <p> zeigt. Bereiten wir zunächst die Darstellung von <p> in Farbwert #ffa07a vor.

In diesem Beispiel umranden wir <p> mit einem 3 Pixel dicken, herausstehenden Rahmen in Farbwert #ffa07a.

<style type="text/css"><!--
  p { border:3px outset #ffa07a; }
//-->
</style>

Nun stellen wir ein, dass sich bei Hover die Rahmenfarbe zu #bc8f8f ändert.

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

Mehr zum Thema p können Sie in Grundlegende Gestaltungselemente in HTML finden. Mehr zum Befehl p lesen Sie in der HTML Referenz unter <p>.

Wechsel der Textfarbe bei Hover von Tag h2

Eine Überschrift erzeugen Sie mit Befehl <h2>. Diese können Sie farblich gestalten.

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

Als Beispiel setzen wir die Textfarbe von <h2> auf Farbwert #ffa07a. Zwar lassen wir die Hintergrundfarbe unverändert, setzen jedoch die Schriftart auf monospace. Die Größe der Schrift verringern wir auf 90%:

<style type="text/css"><!--
  h2 { 
    color: #ffa07a; 
    font-size: 90%; 
    font-family: monospace;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Mausberührung die Textfarbe auf #bc8f8f ändert.

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

Mehr zu h2 können Sie in Grundlegende Gestaltungselemente in HTML lesen. Mehr zum hier gezeigten HTML-Befehl h2 erfahren Sie in der HTML Referenz unter <h2>.