Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #fffacd und Farbwert #ffefd5

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 #fffacd			Schriftfarbwert #ffefd5
Detail	:	Hintergrund #fffacd	Detail	:	Schrift #ffefd5
Farbwert	:	#fffacd	Farbwert	:	#ffefd5
Farbe	:	lemonchiffon	Farbe	:	papayawhip
HTML	:	#fffacd	HTML	:	#ffefd5
HTML (Wert)	:	#fffacd	HTML (Wert)	:	#ffefd5
CSS	:	#fffacd	CSS	:	#ffefd5
CSS (Wert)	:	#fffacd	CSS (Wert)	:	#ffefd5
CSS (kürzest)	:	#fffacd	CSS (kürzest)	:	#ffefd5
CSS (RGB)	:	rgb(255,250,205)	CSS (RGB)	:	rgb(255,239,213)
CSS (%RGB)	:	rgb(100%,98%,80%)	CSS (%RGB)	:	rgb(100%,93%,83%)

Verlauf Hintergrundfarbwert #fffacd nach Schriftfarbwert #ffefd5
#fffacd	#fff8ce	#fff6cf	#fff5d0	#fff3d1	#fff2d2	#fff0d3	#ffefd5
#fffacd	#fff8ce	#fff6cf	#fff5d0	#fff3d1	#fff2d2	#fff0d3	#ffefd5

Kombination von #fffacd und #ffefd5
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				Die Ähnlichkeit der Farben #ffefd5 und #fffacd beträgt 94.92%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 5.08%. #ffefd5 ist nicht als Schriftfarbe auf Hintergrund #fffacd geeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind geeignet.

Hintergrundfarbwert #fffacd				Schriftfarbwert #ffefd5
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#fffacd	#fffacd	#fffacd	#fffacd	#ffefd5	#ffefd5	#ffefd5	#ffefd5
#fffad4	#fffad4	#dad6af	#dad6af	#fff1db	#fff1db	#daccb6	#daccb6
#fffbdb	#fffbdb	#b6b292	#b6b292	#fff3e1	#fff3e1	#b6aa98	#b6aa98
#fffce2	#fffce2	#918e75	#918e75	#fff5e7	#fff5e7	#918879	#918879
#fffce9	#fffce9	#6d6b57	#6d6b57	#fff8ed	#fff8ed	#6d665b	#6d665b
#fffdf0	#fffdf0	#48473a	#48473a	#fffaf3	#fffaf3	#48443c	#48443c
#fffef7	#fffef7	#24231d	#24231d	#fffcf9	#fffcf9	#24221e	#24221e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #fffacd und Farbwert #ffefd5

Wechsel der Umrandung bei Hover von HTML-Tag p

Die Rahmenfarbe soll sich von Farbwert #fffacd auf Farbwert #ffefd5 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Darstellung von <p> in Farbwert #fffacd vor.

In diesem Beispiel umranden wir <p> mit einem 4 Pixel dicken, herausstehenden Rahmen in Farbwert #fffacd.

<style type="text/css"><!--
  p { 
    border-style:outset; 
    border-color:#fffacd; 
    border-width:4px;
  }
//-->
</style>

Nun fordern wir, dass bei Mausberührung die Rahmenfarbe auf #ffefd5 geändert wird.

<style type="text/css"><!--
  p: hover { 
    border-color: #ffefd5;
  }
//-->
</style>

Mehr zum Thema p finden Sie in Grundlegende Gestaltungselemente in HTML. Die Beschreibung des hier gezeigten HTML-Befehl p finden Sie in der HTML Referenz unter <p>.

Zebra-Effekt von HTML-Tag td

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, redet man von einem so genannten Zebra-Effekt. Dieser Effekt unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <td> mit unterschiedlichen Hintergrundfarben Farbwert #fffacd und Farbwert #ffefd5.

<style type="text/css"><!--
  td.ung { 
    background-color: #fffacd;
  }
  td.ger { 
    background-color: #ffefd5;
  }
//-->
</style>

Diese werden dann abwechselnd genutzt.

<table>
<tr><td class="ung">Ga-a</td><td class="ger">Gb-a</td><td class="ung">Gc-a</td></tr>
<tr><td class="ung">Ga-b</td><td class="ger">Gb-b</td><td class="ung">Gc-b</td></tr>
<tr><td class="ung">Ga-c</td><td class="ger">Gb-c</td><td class="ung">Gc-c</td></tr>
</table>

Weiteres zum Thema td erfahren Sie in Tabellen in HTML. Mehr zum Tag <td>.