Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #66cdaa und Farbwert #ff6347

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 #66cdaa			Schriftfarbwert #ff6347
Detail	:	Hintergrund #66cdaa	Detail	:	Schrift #ff6347
Farbwert	:	#66cdaa	Farbwert	:	#ff6347
Farbe	:	mediumaquamarine	Farbe	:	tomato
HTML	:	#66cdaa	HTML	:	#ff6347
HTML (Wert)	:	#66cdaa	HTML (Wert)	:	#ff6347
CSS	:	#66cdaa	CSS	:	#ff6347
CSS (Wert)	:	#66cdaa	CSS (Wert)	:	#ff6347
CSS (kürzest)	:	#66cdaa	CSS (kürzest)	:	#ff6347
CSS (RGB)	:	rgb(102,205,170)	CSS (RGB)	:	rgb(255,99,71)
CSS (%RGB)	:	rgb(40%,80%,66%)	CSS (%RGB)	:	rgb(100%,38%,27%)

Verlauf Hintergrundfarbwert #66cdaa nach Schriftfarbwert #ff6347
#66cdaa	#7bbd9b	#91ae8d	#a79f7f	#bd9071	#d38163	#e97255	#ff6347
#66cdaa	#7bbd9b	#91ae8d	#a79f7f	#bd9071	#d38163	#e97255	#ff6347

Kombination von #66cdaa und #ff6347
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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras vestibulum tristique erat, ac interdum justo cursus in.				#ff6347 ist nicht als Schriftfarbe auf Hintergrund #66cdaa geeignet, da sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit von #ff6347 und #66cdaa ergibt sich zu 92.73%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 7.27%.

Hintergrundfarbwert #66cdaa				Schriftfarbwert #ff6347
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#66cdaa	#66cdaa	#66cdaa	#66cdaa	#ff6347	#ff6347	#ff6347	#ff6347
#7bd4b6	#7bd4b6	#57af91	#57af91	#ff7961	#ff7961	#da543c	#da543c
#91dbc2	#91dbc2	#489279	#489279	#ff8f7b	#ff8f7b	#b64632	#b64632
#a7e2ce	#a7e2ce	#3a7561	#3a7561	#ffa595	#ffa595	#913828	#913828
#bde9da	#bde9da	#2b5748	#2b5748	#ffbcb0	#ffbcb0	#6d2a1e	#6d2a1e
#d3f0e6	#d3f0e6	#1d3a30	#1d3a30	#ffd2ca	#ffd2ca	#481c14	#481c14
#e9f7f2	#e9f7f2	#0e1d18	#0e1d18	#ffe8e4	#ffe8e4	#240e0a	#240e0a
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiel zur Kombination von Farbwert #66cdaa und Farbwert #ff6347

Wechsel der Hintergrundfarbe bei Hover von HTML-Tag pre

Die Hintergrundfarbe soll sich von Farbwert #66cdaa auf Farbwert #ff6347 ändern, wenn man mit der Maus auf <pre> zeigt. Wir bereiten zunächst die Darstellung von <pre> in Farbwert #66cdaa vor.

Wir setzen als Beispiel die Hintergrundfarbe von <pre> auf Farbwert #66cdaa. Zwar ändern wir die Textfarbe nicht, ändern jedoch die Schriftart auf arial. Die Größe der Schrift setzen wir auf 85S%:

<style type="text/css"><!--
  pre { 
    font-family:arial; 
    background-color:#66cdaa; 
    font-size:85S%;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Berührung mit der Maus die Hintergrundfarbe zu #ff6347 ändert.

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

Mehr zum Thema können Sie in Blockorientierte Elemente in HTML nachsehen. Einzelheiten vom HTML-Tag pre sind in der HTML Referenz unter <pre> ausführlich beschrieben.