Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #9400d3 und Farbwert #40e0d0

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 #9400d3			Schriftfarbwert #40e0d0
Detail	:	Hintergrund #9400d3	Detail	:	Schrift #40e0d0
Farbwert	:	#9400d3	Farbwert	:	#40e0d0
Farbe	:	darkviolet	Farbe	:	turquoise
HTML	:	#9400d3	HTML	:	#40e0d0
HTML (Wert)	:	#9400d3	HTML (Wert)	:	#40e0d0
CSS	:	#9400d3	CSS	:	#40e0d0
CSS (Wert)	:	#9400d3	CSS (Wert)	:	#40e0d0
CSS (kürzest)	:	#9400d3	CSS (kürzest)	:	#40e0d0
CSS (RGB)	:	rgb(148,0,211)	CSS (RGB)	:	rgb(64,224,208)
CSS (%RGB)	:	rgb(58%,0%,82%)	CSS (%RGB)	:	rgb(25%,87%,81%)

Verlauf Hintergrundfarbwert #9400d3 nach Schriftfarbwert #40e0d0
#9400d3	#8820d2	#7c40d2	#7060d1	#6480d1	#58a0d0	#4cc0d0	#40e0d0
#9400d3	#8820d2	#7c40d2	#7060d1	#6480d1	#58a0d0	#4cc0d0	#40e0d0

Kombination von #9400d3 und #40e0d0
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 #40e0d0 und #9400d3 beträgt 80.96%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 19.04%. #40e0d0 eignet sich nicht als Schriftfarbe auf Hintergrund #9400d3, weil die Unterschiede in der Helligkeit und Farbe unzureichend sind.

Hintergrundfarbwert #9400d3				Schriftfarbwert #40e0d0
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#9400d3	#9400d3	#9400d3	#9400d3	#40e0d0	#40e0d0	#40e0d0	#40e0d0
#a324d9	#a324d9	#7e00b4	#7e00b4	#5be4d6	#5be4d6	#36c0b2	#36c0b2
#b248df	#b248df	#690096	#690096	#76e8dd	#76e8dd	#2da094	#2da094
#c16de5	#c16de5	#540078	#540078	#91ede4	#91ede4	#248076	#248076
#d191ec	#d191ec	#3f005a	#3f005a	#adf1ea	#adf1ea	#1b6059	#1b6059
#e0b6f2	#e0b6f2	#2a003c	#2a003c	#c8f6f1	#c8f6f1	#12403b	#12403b
#efdaf8	#efdaf8	#15001e	#15001e	#e3faf8	#e3faf8	#09201d	#09201d
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #9400d3 und Farbwert #40e0d0

Zebra-Effekt von Befehl tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man von einem Zebra-Effekt. Dieser Effekt unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ger und .ung für <tr> mit den Hintergrundfarben Farbwert #9400d3 und Farbwert #40e0d0.

<style type="text/css"><!--
  tr.ger { 
    background-color: #9400d3;
  }
  tr.ung { 
    background-color: #40e0d0;
  }
//-->
</style>

Diese Klassen werden abwechselnd verwendet.

<table>
<tr class="ger"><td>BA~A</td><td>BB~A</td><td>BC~A</td></tr>
<tr class="ung"><td>BA~B</td><td>BB~B</td><td>BC~B</td></tr>
<tr class="ger"><td>BA~C</td><td>BB~C</td><td>BC~C</td></tr>
</table>

Mehr zu tr lesen Sie in Tabellen in HTML. Die Beschreibung vom HTML-Tag tr finden Sie in der HTML Referenz unter <tr>.

Wechsel der Textfarbe bei Hover bei HTML-Tag a

Einen Link setzen Sie mit HTML-Tag <a>. Er kann hervorgehoben und farblich gestaltet werden.

Die Textfarbe soll sich von Farbwert #9400d3 auf Farbwert #40e0d0 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <a> in Farbwert #9400d3 vor.

Wir legen hier bei <a> die Textfarbe auf Farbwert #9400d3 fest. Die Schriftgröße erhöhen wir auf 113%:

<style type="text/css"><!--
  a { 
    color:#9400d3; 
    font-size:113%;
  }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Textfarbe auf #40e0d0 gesetzt wird.

<style type="text/css"><!--
  a:hover { 
    color:#40e0d0;
  }
//-->
</style>

Mehr zum Thema können Sie in Verweise und Protokolle in HTML nachsehen. Zur Beschreibung des hier genutzten Befehl <a>.