Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #a0522d und Farbwert #fafad2

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 #a0522d			Schriftfarbwert #fafad2
Detail	:	Hintergrund #a0522d	Detail	:	Schrift #fafad2
Farbwert	:	#a0522d	Farbwert	:	#fafad2
Farbe	:	sienna	Farbe	:	lightgoldenrodyellow
HTML	:	#a0522d	HTML	:	#fafad2
HTML (Wert)	:	#a0522d	HTML (Wert)	:	#fafad2
CSS	:	#a0522d	CSS	:	#fafad2
CSS (Wert)	:	#a0522d	CSS (Wert)	:	#fafad2
CSS (kürzest)	:	#a0522d	CSS (kürzest)	:	#fafad2
CSS (RGB)	:	rgb(160,82,45)	CSS (RGB)	:	rgb(250,250,210)
CSS (%RGB)	:	rgb(62%,32%,17%)	CSS (%RGB)	:	rgb(98%,98%,82%)

Verlauf Hintergrundfarbwert #a0522d nach Schriftfarbwert #fafad2
#a0522d	#ac6a44	#b9825c	#c69a73	#d3b28b	#e0caa2	#ede2ba	#fafad2
#a0522d	#ac6a44	#b9825c	#c69a73	#d3b28b	#e0caa2	#ede2ba	#fafad2

Kombination von #a0522d und #fafad2
Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in. 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. Lorem ipsum dolor sit amet, consectetur adipiscing elit.				Die Ähnlichkeit von #fafad2 und #a0522d ergibt sich zu 74.95%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 25.05%. #fafad2 eignet sich nicht als Schriftfarbe auf Hintergrund #a0522d. Zwar ist der Helligkeitsunterschied ok, doch die Farben selbst sind zu ähnlich.

Hintergrundfarbwert #a0522d				Schriftfarbwert #fafad2
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#a0522d	#a0522d	#a0522d	#a0522d	#fafad2	#fafad2	#fafad2	#fafad2
#ad6a4b	#ad6a4b	#894626	#894626	#fafad8	#fafad8	#d6d6b4	#d6d6b4
#bb8369	#bb8369	#723a20	#723a20	#fbfbde	#fbfbde	#b2b296	#b2b296
#c89c87	#c89c87	#5b2e19	#5b2e19	#fcfce5	#fcfce5	#8e8e78	#8e8e78
#d6b4a5	#d6b4a5	#442313	#442313	#fcfceb	#fcfceb	#6b6b5a	#6b6b5a
#e3cdc3	#e3cdc3	#2d170c	#2d170c	#fdfdf2	#fdfdf2	#47473c	#47473c
#f1e6e1	#f1e6e1	#160b06	#160b06	#fefef8	#fefef8	#23231e	#23231e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #a0522d und Farbwert #fafad2

Füllen und Umranden von Tag hr

Bei diesem Beispiel umranden wir <hr> mit einem gestrichelten, 5 Punkte dicken Rahmen in Farbwert #fafad2 . Den Hintergrund von <hr> setzen wir entsprechend auf Farbwert #a0522d. Dies geht mit HTML nicht. Daher nutzen wir CSS zur Formatierung.

<style type="text/css"><!--
  hr { border:5pt dashed #fafad2; background-color:#a0522d; }
//-->
</style>

Weiteres zu hr finden Sie in Grundlegende Gestaltungselemente in HTML. Mehr zum hier verwendeten Tag hr ist in der HTML Referenz unter <hr> genau zusammengestellt.

Wechsel der Hintergrundfarbe bei Hover mit HTML-Befehl a

Ein Hyperlink wird mit Befehl <a> gesetzt. Diesen kann man farblich gestalten und hervorheben.

Die Hintergrundfarbe soll sich von Farbwert #a0522d auf Farbwert #fafad2 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <a> in Farbwert #a0522d vor.

Wir legen als Beispiel bei <a> die Hintergrundfarbe auf Farbwert #a0522d fest. Die Textfarbe behalten wir bei. Die Schriftart ändern wir auf arial. Die Größe der Schrift setzen wir auf 13px:

<style type="text/css"><!--
  a { 
    font-size: 13px; 
    font-family: arial; 
    background-color: #a0522d;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Hover die Hintergrundfarbe zu #fafad2 ändert.

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

Mehr zum Thema a können Sie in Verweise und Protokolle in HTML lesen. Der hier gezeigte HTML-Befehl a ist in der HTML Referenz unter <a> genau zusammengestellt.