Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #fffaf0 und Farbwert #ba55d3

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 #fffaf0			Schriftfarbwert #ba55d3
Detail	:	Hintergrund #fffaf0	Detail	:	Schrift #ba55d3
Farbwert	:	#fffaf0	Farbwert	:	#ba55d3
Farbe	:	floralwhite	Farbe	:	mediumorchid
HTML	:	#fffaf0	HTML	:	#ba55d3
HTML (Wert)	:	#fffaf0	HTML (Wert)	:	#ba55d3
CSS	:	#fffaf0	CSS	:	#ba55d3
CSS (Wert)	:	#fffaf0	CSS (Wert)	:	#ba55d3
CSS (kürzest)	:	#fffaf0	CSS (kürzest)	:	#ba55d3
CSS (RGB)	:	rgb(255,250,240)	CSS (RGB)	:	rgb(186,85,211)
CSS (%RGB)	:	rgb(100%,98%,94%)	CSS (%RGB)	:	rgb(72%,33%,82%)

Verlauf Hintergrundfarbwert #fffaf0 nach Schriftfarbwert #ba55d3
#fffaf0	#f5e2eb	#ebcae7	#e1b3e3	#d79bdf	#cd84db	#c36cd7	#ba55d3
#fffaf0	#f5e2eb	#ebcae7	#e1b3e3	#d79bdf	#cd84db	#c36cd7	#ba55d3

Kombination von #fffaf0 und #ba55d3
Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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.				Die Ähnlichkeit der Farben #ba55d3 und #fffaf0 beträgt 81.96%. Die Lesbarkeit dieser Kombination ergibt sich zu 18.04%. #ba55d3 ist nicht als Schriftfarbe auf Hintergrund #fffaf0 geeignet. Die Unterschiede in der Helligkeit und Farbe sind nicht ausreichend.

Hintergrundfarbwert #fffaf0				Schriftfarbwert #ba55d3
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#fffaf0	#fffaf0	#fffaf0	#fffaf0	#ba55d3	#ba55d3	#ba55d3	#ba55d3
#fffaf2	#fffaf2	#dad6cd	#dad6cd	#c36dd9	#c36dd9	#9f48b4	#9f48b4
#fffbf4	#fffbf4	#b6b2ab	#b6b2ab	#cd85df	#cd85df	#843c96	#843c96
#fffcf6	#fffcf6	#918e89	#918e89	#d79de5	#d79de5	#6a3078	#6a3078
#fffcf8	#fffcf8	#6d6b66	#6d6b66	#e1b6ec	#e1b6ec	#4f245a	#4f245a
#fffdfa	#fffdfa	#484744	#484744	#ebcef2	#ebcef2	#35183c	#35183c
#fffefc	#fffefc	#242322	#242322	#f5e6f8	#f5e6f8	#1a0c1e	#1a0c1e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #fffaf0 und Farbwert #ba55d3

Wechsel der Textfarbe bei Hover bei Tag kbd

Die Textfarbe soll sich von Farbwert #fffaf0 auf Farbwert #ba55d3 ändern, wenn man mit der Maus auf <kbd> zeigt. Wir bereiten zunächst die Formatierung von <kbd> in Farbwert #fffaf0 vor.

Wir setzen für dieses Beispiel bei <kbd> die Textfarbe auf Farbwert #fffaf0. Zwar ändern wir die Hintergrundfarbe nicht, ändern jedoch die Schriftart auf arial.

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

Jetzt fordern wir, dass bei Hover die Textfarbe auf #ba55d3 geändert wird.

<style type="text/css"><!--
  kbd:hover { 
    color:#ba55d3;
  }
//-->
</style>

Mehr zu kbd finden Sie in Text in HTML. Mehr zum Tag kbd ist in der HTML Referenz unter <kbd> genau gezeigt.

Wechsel der Hintergrundfarbe bei Hover bei Befehl blockquote

Die Hintergrundfarbe soll sich von Farbwert #fffaf0 auf Farbwert #ba55d3 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <blockquote> in Farbwert #fffaf0 vor.

Hier legen wir Farbwert #fffaf0 als Hintergrundfarbe von <blockquote> fest. Die Textfarbe behalten wir bei, ändern jedoch die Schriftart auf sans-serif. Die Schriftgröße ändern wir auf 13px:

<style type="text/css"><!--
  blockquote { 
    background-color: #fffaf0; 
    font-family: sans-serif; 
    font-size: 13px;
  }
//-->
</style>

Nun fordern wir, dass bei Mausberührung die Hintergrundfarbe auf #ba55d3 gesetzt wird.

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

Weiteres zum Thema blockquote können Sie in Blockorientierte Elemente in HTML nachlesen. Weiteres zum hier verwendeten HTML-Tag blockquote finden Sie in der HTML Referenz unter <blockquote>.