Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #556b2f und Farbwert #faf0e6

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 #556b2f			Schriftfarbwert #faf0e6
Detail	:	Hintergrund #556b2f	Detail	:	Schrift #faf0e6
Farbwert	:	#556b2f	Farbwert	:	#faf0e6
Farbe	:	darkolivegreen	Farbe	:	linen
HTML	:	#556b2f	HTML	:	#faf0e6
HTML (Wert)	:	#556b2f	HTML (Wert)	:	#faf0e6
CSS	:	#556b2f	CSS	:	#faf0e6
CSS (Wert)	:	#556b2f	CSS (Wert)	:	#faf0e6
CSS (kürzest)	:	#556b2f	CSS (kürzest)	:	#faf0e6
CSS (RGB)	:	rgb(85,107,47)	CSS (RGB)	:	rgb(250,240,230)
CSS (%RGB)	:	rgb(33%,41%,18%)	CSS (%RGB)	:	rgb(98%,94%,90%)

Verlauf Hintergrundfarbwert #556b2f nach Schriftfarbwert #faf0e6
#556b2f	#6c7e49	#849163	#9ba47d	#b3b797	#cacab1	#e2ddcb	#faf0e6
#556b2f	#6c7e49	#849163	#9ba47d	#b3b797	#cacab1	#e2ddcb	#faf0e6

Kombination von #556b2f und #faf0e6
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante.				Die Ähnlichkeit der Farben #faf0e6 und #556b2f ergibt sich zu 74.82%. Die Lesbarkeit dieser Kombination ergibt sich zu 25.18%. #faf0e6 eignet sich nicht als Schriftfarbe auf Hintergrund #556b2f, da die Farben zu ähnlich sind.

Hintergrundfarbwert #556b2f				Schriftfarbwert #faf0e6
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#556b2f	#556b2f	#556b2f	#556b2f	#faf0e6	#faf0e6	#faf0e6	#faf0e6
#6d804c	#6d804c	#485b28	#485b28	#faf2e9	#faf2e9	#d6cdc5	#d6cdc5
#85956a	#85956a	#3c4c21	#3c4c21	#fbf4ed	#fbf4ed	#b2aba4	#b2aba4
#9daa88	#9daa88	#303d1a	#303d1a	#fcf6f0	#fcf6f0	#8e8983	#8e8983
#b6bfa5	#b6bfa5	#242d14	#242d14	#fcf8f4	#fcf8f4	#6b6662	#6b6662
#ced4c3	#ced4c3	#181e0d	#181e0d	#fdfaf7	#fdfaf7	#474441	#474441
#e6e9e1	#e6e9e1	#0c0f06	#0c0f06	#fefcfb	#fefcfb	#232220	#232220
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #556b2f und Farbwert #faf0e6

Text- und Unterstreichungsfarben bei Befehl label

Hier ändern wir die Textfarbe von <label> auf Farbwert #faf0e6. Die Schriftart ändern wir auf sans-serif. Die Schriftgröße setzen wir auf 121%. Wir unterstreichen den Inhalt von <label> mit Hilfe eines gestrichelten Rahmens mit 1 Pixel Dicke in Farbwert #556b2f. Mit HTML geht das nicht. Deshalb verwenden wir CSS zur Formatierung.

<style type="text/css"><!--
  label { 
    font-family: sans-serif; 
    border-bottom: 1px dashed #556b2f; 
    color: #faf0e6; 
    font-size: 121%;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben.

Mehr zum Thema können Sie in Formulare in HTML nachsehen. Die Beschreibung des hier gezeigten HTML-Befehl label erfahren Sie in der HTML Referenz unter <label>.

Wechsel der Hintergrundfarbe bei Hover mit Befehl dd

Die Hintergrundfarbe soll sich von Farbwert #556b2f auf Farbwert #faf0e6 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <dd> in Farbwert #556b2f vor.

In diesem Beispiel ändern wir bei <dd> die Hintergrundfarbe auf Farbwert #556b2f und setzen die Schriftgröße auf 13px:

<style type="text/css"><!--
  dd { 
    font-size:13px; 
    background-color:#556b2f;
  }
//-->
</style>

Nun stellen wir ein, dass sich bei Berührung mit der Maus die Hintergrundfarbe zu #faf0e6 ändert.

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

Weiteres zum Thema können Sie in Listen und Glossare in HTML nachlesen. Zur Beschreibung des hier gezeigten HTML-Tag <dd>.