Ressourcen: 137 HTML Farbnamen - Kombination von Farbe cornflowerblue und Farbwert #cd853f

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.

Hintergrundfarbe cornflowerblue			Schriftfarbwert #cd853f
Detail	:	Hintergrund cornflowerblue	Detail	:	Schrift #cd853f
Farbe	:	cornflowerblue	Farbwert	:	#cd853f
Farbwert	:	#6495ed	Farbe	:	peru
HTML	:	cornflowerblue	HTML	:	#cd853f
HTML (Wert)	:	#6495ed	HTML (Wert)	:	#cd853f
CSS	:	cornflowerblue	CSS	:	#cd853f
CSS (Wert)	:	#6495ed	CSS (Wert)	:	#cd853f
CSS (kürzest)	:	#6495ed	CSS (kürzest)	:	#cd853f
CSS (RGB)	:	rgb(100,149,237)	CSS (RGB)	:	rgb(205,133,63)
CSS (%RGB)	:	rgb(39%,58%,92%)	CSS (%RGB)	:	rgb(80%,52%,24%)

Verlauf Hintergrundfarbe cornflowerblue nach Schriftfarbwert #cd853f
#6495ed	#7392d4	#8290bb	#918ea2	#a08b89	#af8970	#be8757	#cd853f
#6495ed	#7392d4	#8290bb	#918ea2	#a08b89	#af8970	#be8757	#cd853f

Kombination von cornflowerblue und #cd853f
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. Cras id velit ante.				#cd853f ist nicht als Schriftfarbe auf Hintergrund cornflowerblue geeignet. Sowohl Helligkeit als auch die Farben sind zu ähnlich. Die Ähnlichkeit von #cd853f und cornflowerblue ergibt sich zu 95.21%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 4.79%.

Hintergrundfarbe cornflowerblue				Schriftfarbwert #cd853f
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#6495ed	#6495ed	#6495ed	#6495ed	#cd853f	#cd853f	#cd853f	#cd853f
#7aa4ef	#7aa4ef	#557fcb	#557fcb	#d4965a	#d4965a	#af7236	#af7236
#90b3f2	#90b3f2	#476aa9	#476aa9	#dba775	#dba775	#925f2d	#925f2d
#a6c2f4	#a6c2f4	#395587	#395587	#e2b991	#e2b991	#754c24	#754c24
#bcd1f7	#bcd1f7	#2a3f65	#2a3f65	#e9caac	#e9caac	#57391b	#57391b
#d2e0f9	#d2e0f9	#1c2a43	#1c2a43	#f0dcc8	#f0dcc8	#3a2612	#3a2612
#e8effc	#e8effc	#0e1521	#0e1521	#f7ede3	#f7ede3	#1d1309	#1d1309
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe cornflowerblue und Farbwert #cd853f

Wechsel der Umrandung bei Hover von Tag frameset

Die Rahmenfarbe soll sich von Farbe cornflowerblue auf Farbwert #cd853f ändern, wenn man mit der Maus auf <frameset> zeigt. Bereiten wir zunächst die Darstellung von <frameset> in Farbe cornflowerblue vor.

In diesem Beispiel umranden wir <frameset> mit einem 4 Pixel dicken, doppelten Rahmen in Farbe cornflowerblue.

<style type="text/css"><!--
  frameset { 
    border-color:cornflowerblue; 
    border-width:4px; 
    border-style:double;
  }
//-->
</style>

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

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

Einzelheiten des hier genutzten Befehl frameset sind in der HTML Referenz unter <frameset> genau zusammengestellt.

Text- und Unterstreichungsfarben von Befehl label

In diesem Beispiel ändern wir die Textfarbe von <label> auf Farbwert #cd853f und lassen die Hintergrundfarbe unverändert. Die Schriftart setzen wir auf monospace. Die Schriftgröße vergrößern wir auf 118%. Wir unterstreichen den Inhalt von <label> mit Hilfe eines gezahnten Rahmens mit 3 Pixel Dicke in Farbe cornflowerblue. In HTML ist dies kaum machbar. Wir nutzen deshalb CSS zur Formatierung.

<style type="text/css"><!--
  label { 
    border-bottom-width: 3px; 
    color: #cd853f; 
    border-bottom-color: cornflowerblue; 
    font-size: 118%; 
    font-family: monospace; 
    border-bottom-style: ridge;
  }
//-->
</style>

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

Mehr zum Thema können Sie in Formulare in HTML nachlesen. Der hier verwendete HTML-Tag label ist in der HTML Referenz unter <label> genau zusammengestellt.