Ressourcen: 137 HTML Farbnamen - Kombination von Farbe slateblue und Farbwert #ffa500

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.

Hintergrundfarbe slateblue			Schriftfarbwert #ffa500
Detail	:	Hintergrund slateblue	Detail	:	Schrift #ffa500
Farbe	:	slateblue	Farbwert	:	#ffa500
Farbwert	:	#6a5acd	Farbe	:	orange
HTML	:	slateblue	HTML	:	#ffa500
HTML (Wert)	:	#6a5acd	HTML (Wert)	:	#ffa500
CSS	:	slateblue	CSS	:	#ffa500
CSS (Wert)	:	#6a5acd	CSS (Wert)	:	#ffa500
CSS (kürzest)	:	#6a5acd	CSS (kürzest)	:	#ffa500
CSS (RGB)	:	rgb(106,90,205)	CSS (RGB)	:	rgb(255,165,0)
CSS (%RGB)	:	rgb(41%,35%,80%)	CSS (%RGB)	:	rgb(100%,64%,0%)

Verlauf Hintergrundfarbe slateblue nach Schriftfarbwert #ffa500
#6a5acd	#7f64af	#946f92	#a97a75	#bf8457	#d48f3a	#e99a1d	#ffa500
#6a5acd	#7f64af	#946f92	#a97a75	#bf8457	#d48f3a	#e99a1d	#ffa500

Kombination von slateblue und #ffa500
Cras vestibulum tristique erat, ac interdum justo cursus in. 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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante.				Die Ähnlichkeit der Farben #ffa500 und slateblue beträgt 87.20%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 12.80%. #ffa500 eignet sich nicht als Schriftfarbe auf Hintergrund slateblue, da sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbe slateblue				Schriftfarbwert #ffa500
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#6a5acd	#6a5acd	#6a5acd	#6a5acd	#ffa500	#ffa500	#ffa500	#ffa500
#7f71d4	#7f71d4	#5a4daf	#5a4daf	#ffb124	#ffb124	#da8d00	#da8d00
#9489db	#9489db	#4b4092	#4b4092	#ffbe48	#ffbe48	#b67500	#b67500
#a9a0e2	#a9a0e2	#3c3375	#3c3375	#ffcb6d	#ffcb6d	#915e00	#915e00
#bfb8e9	#bfb8e9	#2d2657	#2d2657	#ffd891	#ffd891	#6d4600	#6d4600
#d4cff0	#d4cff0	#1e193a	#1e193a	#ffe5b6	#ffe5b6	#482f00	#482f00
#e9e7f7	#e9e7f7	#0f0c1d	#0f0c1d	#fff2da	#fff2da	#241700	#241700
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe slateblue und Farbwert #ffa500

Wechsel der Umrandung bei Hover bei Tag samp

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

In diesem Beispiel umranden wir <samp> mit einem 1 Pixel dicken, herausstehenden Rahmen in Farbe slateblue.

<style type="text/css"><!--
  samp { border:1px outset slateblue; }
//-->
</style>

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

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

Mehr zu samp können Sie in Text in HTML nachlesen. Weiteres zum hier genutzten HTML-Befehl samp finden Sie in der HTML Referenz unter <samp>.

Wechsel der Hintergrundfarbe bei Hover bei Befehl abbr

Die Hintergrundfarbe soll sich von Farbe slateblue auf Farbwert #ffa500 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <abbr> in Farbe slateblue vor.

Als Beispiel legen wir die Hintergrundfarbe von <abbr> auf Farbe slateblue fest. Zwar lassen wir die Textfarbe unverändert, ändern jedoch die Schriftart auf verdana. Die Größe der Schrift erhöhen wir auf 119%.

<style type="text/css"><!--
  abbr { 
    background-color:slateblue; 
    font-size:119%; 
    font-family:verdana;
  }
//-->
</style>

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

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

Die Beschreibung vom HTML-Befehl abbr lesen Sie in der HTML Referenz unter <abbr>.