Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #afeeee und Farbe turquoise

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 #afeeee			Schriftfarbe turquoise
Detail	:	Hintergrund #afeeee	Detail	:	Schrift turquoise
Farbwert	:	#afeeee	Farbe	:	turquoise
Farbe	:	paleturquoise	Farbwert	:	#40e0d0
HTML	:	#afeeee	HTML	:	turquoise
HTML (Wert)	:	#afeeee	HTML (Wert)	:	#40e0d0
CSS	:	#afeeee	CSS	:	turquoise
CSS (Wert)	:	#afeeee	CSS (Wert)	:	#40e0d0
CSS (kürzest)	:	#afeeee	CSS (kürzest)	:	#40e0d0
CSS (RGB)	:	rgb(175,238,238)	CSS (RGB)	:	rgb(64,224,208)
CSS (%RGB)	:	rgb(68%,93%,93%)	CSS (%RGB)	:	rgb(25%,87%,81%)

Verlauf Hintergrundfarbwert #afeeee nach Schriftfarbe turquoise
#afeeee	#9fece9	#8feae5	#7fe8e1	#6fe6dc	#5fe4d8	#4fe2d4	#40e0d0
#afeeee	#9fece9	#8feae5	#7fe8e1	#6fe6dc	#5fe4d8	#4fe2d4	#40e0d0

Kombination von #afeeee und turquoise
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 vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante.				Auf Hintergrund #afeeee ist turquoise ungeeignet, da sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit der Farben turquoise und #afeeee beträgt 93.94%. Die Lesbarkeit dieser Kombination bewerte ich mit 6.06%.

Hintergrundfarbwert #afeeee				Schriftfarbe turquoise
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#afeeee	#afeeee	#afeeee	#afeeee	#40e0d0	#40e0d0	#40e0d0	#40e0d0
#baf0f0	#baf0f0	#96cccc	#96cccc	#5be4d6	#5be4d6	#36c0b2	#36c0b2
#c5f2f2	#c5f2f2	#7daaaa	#7daaaa	#76e8dd	#76e8dd	#2da094	#2da094
#d1f5f5	#d1f5f5	#648888	#648888	#91ede4	#91ede4	#248076	#248076
#dcf7f7	#dcf7f7	#4b6666	#4b6666	#adf1ea	#adf1ea	#1b6059	#1b6059
#e8fafa	#e8fafa	#324444	#324444	#c8f6f1	#c8f6f1	#12403b	#12403b
#f3fcfc	#f3fcfc	#192222	#192222	#e3faf8	#e3faf8	#09201d	#09201d
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #afeeee und Farbe turquoise

Zebra-Effekt von HTML-Befehl th

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man von einem Zebra-Effekt. Der Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ying und .yang für <th> mit unterschiedlichen Hintergrundfarben Farbwert #afeeee und Farbe turquoise.

<style type="text/css"><!--
  th.ying { 
    background-color:#afeeee;
  }
  th.yang { 
    background-color: turquoise;
  }
//-->
</style>

Diese Klassen werden dann abwechselnd verwendet.

<table>
<tr><td class="ying">Aa~a</td><td class="yang">Ab~a</td><td class="ying">Ac~a</td></tr>
<tr><td class="ying">Aa~b</td><td class="yang">Ab~b</td><td class="ying">Ac~b</td></tr>
<tr><td class="ying">Aa~c</td><td class="yang">Ab~c</td><td class="ying">Ac~c</td></tr>
</table>

Weiteres zum Thema erfahren Sie in Tabellen in HTML. Beschreibung des HTML-Tag <th>.

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag form

Die Hintergrundfarbe soll sich von Farbwert #afeeee auf Farbe turquoise ändern, wenn man mit der Maus auf <form> zeigt. Wir bereiten zunächst eine Darstellung von <form> in Farbwert #afeeee vor.

Für dieses Beispiel legen wir Farbwert #afeeee als Hintergrundfarbe von <form> fest. Zwar behalten wir die Textfarbe bei, setzen jedoch die Schriftart auf arial.

<style type="text/css"><!--
  form { 
    font-family: arial; 
    background-color: #afeeee;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Berührung mit der Maus die Hintergrundfarbe zu turquoise ändert.

<style type="text/css"><!--
  form:hover { 
    background-color:turquoise;
  }
//-->
</style>

Weiteres zum Thema form erfahren Sie in Formulare in HTML. Der hier genutzte HTML-Befehl form ist in der HTML Referenz bei <form> genau beschrieben.