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

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 #ffa07a			Schriftfarbwert #66cdaa
Detail	:	Hintergrund #ffa07a	Detail	:	Schrift #66cdaa
Farbwert	:	#ffa07a	Farbwert	:	#66cdaa
Farbe	:	lightsalmon	Farbe	:	mediumaquamarine
HTML	:	#ffa07a	HTML	:	#66cdaa
HTML (Wert)	:	#ffa07a	HTML (Wert)	:	#66cdaa
CSS	:	#ffa07a	CSS	:	#66cdaa
CSS (Wert)	:	#ffa07a	CSS (Wert)	:	#66cdaa
CSS (kürzest)	:	#ffa07a	CSS (kürzest)	:	#66cdaa
CSS (RGB)	:	rgb(255,160,122)	CSS (RGB)	:	rgb(102,205,170)
CSS (%RGB)	:	rgb(100%,62%,47%)	CSS (%RGB)	:	rgb(40%,80%,66%)

Verlauf Hintergrundfarbwert #ffa07a nach Schriftfarbwert #66cdaa
#ffa07a	#e9a680	#d3ac87	#bdb38e	#a7b995	#91c09c	#7bc6a3	#66cdaa
#ffa07a	#e9a680	#d3ac87	#bdb38e	#a7b995	#91c09c	#7bc6a3	#66cdaa

Kombination von #ffa07a und #66cdaa
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras vestibulum tristique erat, ac interdum justo cursus in. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				Die Ähnlichkeit der Farben #66cdaa und #ffa07a ergibt sich zu 95.10%. Die Lesbarkeit dieser Kombination liegt damit bei 4.90%. Auf Hintergrund #ffa07a ist #66cdaa ungeeignet, weil sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbwert #ffa07a				Schriftfarbwert #66cdaa
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffa07a	#ffa07a	#ffa07a	#ffa07a	#66cdaa	#66cdaa	#66cdaa	#66cdaa
#ffad8d	#ffad8d	#da8968	#da8968	#7bd4b6	#7bd4b6	#57af91	#57af91
#ffbba0	#ffbba0	#b67257	#b67257	#91dbc2	#91dbc2	#489279	#489279
#ffc8b3	#ffc8b3	#915b45	#915b45	#a7e2ce	#a7e2ce	#3a7561	#3a7561
#ffd6c6	#ffd6c6	#6d4434	#6d4434	#bde9da	#bde9da	#2b5748	#2b5748
#ffe3d9	#ffe3d9	#482d22	#482d22	#d3f0e6	#d3f0e6	#1d3a30	#1d3a30
#fff1ec	#fff1ec	#241611	#241611	#e9f7f2	#e9f7f2	#0e1d18	#0e1d18
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ffa07a und Farbwert #66cdaa

Wechsel der Umrandung bei Hover bei Tag img

Die Rahmenfarbe soll sich von Farbwert #ffa07a auf Farbwert #66cdaa ändern, wenn man mit der Maus auf <img> zeigt. Bereiten wir zunächst die Darstellung von <img> in Farbwert #ffa07a vor.

In diesem Beispiel umranden wir <img> mit einem 3 Pixel dicken, einfallenden Rahmen in Farbwert #ffa07a.

<style type="text/css"><!--
  img { 
    border-style:inset; 
    border-color:#ffa07a; 
    border-width:3px;
  }
//-->
</style>

Nun stellen wir ein, dass bei Berührung mit der Maus die Rahmenfarbe auf #66cdaa gesetzt wird.

<style type="text/css"><!--
  img:hover { 
    border-color:#66cdaa;
  }
//-->
</style>

Mehr zu img erfahren Sie in Grafik in HTML. Der HTML-Befehl img ist in der HTML Referenz bei <img> ausführlich beschrieben.

Wechsel der Hintergrundfarbe bei Hover von HTML-Befehl li

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

Wir legen in diesem Beispiel Farbwert #ffa07a als Hintergrundfarbe von <li> fest. Zwar ändern wir die Textfarbe nicht, ändern jedoch die Schriftart auf arial und setzen die Größe der Schrift auf 84%.

<style type="text/css"><!--
  li { 
    font-family: arial; 
    background-color: #ffa07a; 
    font-size: 84%;
  }
//-->
</style>

Nun stellen wir ein, dass sich bei Mausberührung die Hintergrundfarbe auf #66cdaa ändert.

<style type="text/css"><!--
  li: hover { 
    background-color: #66cdaa;
  }
//-->
</style>

Mehr zum Thema li können Sie in Listen und Glossare in HTML nachsehen. Zur Beschreibung des Befehl <li>.