Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #6a5acd und Farbwert #87cefa

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 #6a5acd			Schriftfarbwert #87cefa
Detail	:	Hintergrund #6a5acd	Detail	:	Schrift #87cefa
Farbwert	:	#6a5acd	Farbwert	:	#87cefa
Farbe	:	slateblue	Farbe	:	lightskyblue
HTML	:	#6a5acd	HTML	:	#87cefa
HTML (Wert)	:	#6a5acd	HTML (Wert)	:	#87cefa
CSS	:	#6a5acd	CSS	:	#87cefa
CSS (Wert)	:	#6a5acd	CSS (Wert)	:	#87cefa
CSS (kürzest)	:	#6a5acd	CSS (kürzest)	:	#87cefa
CSS (RGB)	:	rgb(106,90,205)	CSS (RGB)	:	rgb(135,206,250)
CSS (%RGB)	:	rgb(41%,35%,80%)	CSS (%RGB)	:	rgb(52%,80%,98%)

Verlauf Hintergrundfarbwert #6a5acd nach Schriftfarbwert #87cefa
#6a5acd	#6e6ad3	#727bd9	#768be0	#7a9ce6	#7eaced	#82bdf3	#87cefa
#6a5acd	#6e6ad3	#727bd9	#768be0	#7a9ce6	#7eaced	#82bdf3	#87cefa

Kombination von #6a5acd und #87cefa
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. 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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Auf Hintergrund #6a5acd ist #87cefa ungeeignet, da weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind. Die Ähnlichkeit der Farben #87cefa und #6a5acd beträgt 85.27%. Die Lesbarkeit dieser Kombination bewerte ich mit 14.73%.

Hintergrundfarbwert #6a5acd				Schriftfarbwert #87cefa
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#6a5acd	#6a5acd	#6a5acd	#6a5acd	#87cefa	#87cefa	#87cefa	#87cefa
#7f71d4	#7f71d4	#5a4daf	#5a4daf	#98d5fa	#98d5fa	#73b0d6	#73b0d6
#9489db	#9489db	#4b4092	#4b4092	#a9dcfb	#a9dcfb	#6093b2	#6093b2
#a9a0e2	#a9a0e2	#3c3375	#3c3375	#bae3fc	#bae3fc	#4d758e	#4d758e
#bfb8e9	#bfb8e9	#2d2657	#2d2657	#cbeafc	#cbeafc	#39586b	#39586b
#d4cff0	#d4cff0	#1e193a	#1e193a	#dcf1fd	#dcf1fd	#263a47	#263a47
#e9e7f7	#e9e7f7	#0f0c1d	#0f0c1d	#edf8fe	#edf8fe	#131d23	#131d23
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #6a5acd und Farbwert #87cefa

Wechsel der Textfarbe bei Hover mit Tag li

Die Textfarbe soll sich von Farbwert #6a5acd auf Farbwert #87cefa ändern, wenn man mit der Maus auf <li> zeigt. Bereiten wir zunächst eine Formatierung von <li> in Farbwert #6a5acd vor.

Wir legen zum Beispiel die Textfarbe von <li> auf Farbwert #6a5acd fest. Die Hintergrundfarbe behalten wir bei. Die Schriftart ändern wir auf sans-serif. Die Größe der Schrift setzen wir auf 13px.

<style type="text/css"><!--
  li { 
    font-family:sans-serif; 
    color:#6a5acd; 
    font-size:13px;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Textfarbe auf #87cefa gesetzt wird.

<style type="text/css"><!--
  li:hover { 
    color:#87cefa;
  }
//-->
</style>

Mehr zum Thema können Sie in Listen und Glossare in HTML lesen. Der hier gezeigte HTML-Tag li ist in der HTML Referenz unter <li> ausführlich beschrieben.

Wechsel der Umrandung bei Hover bei Befehl hr

Die Rahmenfarbe soll sich von Farbwert #6a5acd auf Farbwert #87cefa ändern, wenn man mit der Maus auf <hr> zeigt. Bereiten wir zunächst die Darstellung von <hr> in Farbwert #6a5acd vor.

In diesem Beispiel umranden wir <hr> mit einem 2 Pixel dicken, gezahnten Rahmen in Farbwert #6a5acd.

<style type="text/css"><!--
  hr { border:2px ridge #6a5acd; }
//-->
</style>

Nun fordern wir, dass sich bei Mausberührung die Rahmenfarbe zu #87cefa ändert.

<style type="text/css"><!--
  hr:hover { 
    border-color:#87cefa;
  }
//-->
</style>

Weiteres zum Thema können Sie in Grundlegende Gestaltungselemente in HTML nachlesen. Einzelheiten vom hier genutzten Befehl hr erfahren Sie in der HTML Referenz unter <hr>.