Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #20b2aa und Farbwert #fff8dc

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 #20b2aa			Schriftfarbwert #fff8dc
Detail	:	Hintergrund #20b2aa	Detail	:	Schrift #fff8dc
Farbwert	:	#20b2aa	Farbwert	:	#fff8dc
Farbe	:	lightseagreen	Farbe	:	cornsilk
HTML	:	#20b2aa	HTML	:	#fff8dc
HTML (Wert)	:	#20b2aa	HTML (Wert)	:	#fff8dc
CSS	:	#20b2aa	CSS	:	#fff8dc
CSS (Wert)	:	#20b2aa	CSS (Wert)	:	#fff8dc
CSS (kürzest)	:	#20b2aa	CSS (kürzest)	:	#fff8dc
CSS (RGB)	:	rgb(32,178,170)	CSS (RGB)	:	rgb(255,248,220)
CSS (%RGB)	:	rgb(12%,69%,66%)	CSS (%RGB)	:	rgb(100%,97%,86%)

Verlauf Hintergrundfarbwert #20b2aa nach Schriftfarbwert #fff8dc
#20b2aa	#3fbcb1	#5fc6b8	#7fd0bf	#9fdac6	#bfe4cd	#dfeed4	#fff8dc
#20b2aa	#3fbcb1	#5fc6b8	#7fd0bf	#9fdac6	#bfe4cd	#dfeed4	#fff8dc

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

Hintergrundfarbwert #20b2aa				Schriftfarbwert #fff8dc
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#20b2aa	#20b2aa	#20b2aa	#20b2aa	#fff8dc	#fff8dc	#fff8dc	#fff8dc
#3fbdb6	#3fbdb6	#1b9891	#1b9891	#fff9e1	#fff9e1	#dad4bc	#dad4bc
#5fc8c2	#5fc8c2	#167f79	#167f79	#fffae6	#fffae6	#b6b19d	#b6b19d
#7fd3ce	#7fd3ce	#126561	#126561	#fffbeb	#fffbeb	#918d7d	#918d7d
#9fdeda	#9fdeda	#0d4c48	#0d4c48	#fffcf0	#fffcf0	#6d6a5e	#6d6a5e
#bfe9e6	#bfe9e6	#093230	#093230	#fffdf5	#fffdf5	#48463e	#48463e
#dff4f2	#dff4f2	#041918	#041918	#fffefa	#fffefa	#24231f	#24231f
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #20b2aa und Farbwert #fff8dc

Wechsel der Textfarbe bei Hover von HTML-Befehl p

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

Wir legen hier Farbwert #20b2aa als Textfarbe von <p> fest und erhöhen die Größe der Schrift auf 129%.

<style type="text/css"><!--
  p { 
    color: #20b2aa; 
    font-size: 129%;
  }
//-->
</style>

Jetzt stellen wir ein, dass bei Mausberührung die Textfarbe auf #fff8dc gesetzt wird.

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

Weiteres zum Thema p können Sie in Grundlegende Gestaltungselemente in HTML lesen. Mehr zum Tag <p>.

Füllen und Umranden bei Befehl hr

Hier umranden wir <hr> mit einem gepunkteten, 4 Punkte dicken Rahmen in Farbwert #fff8dc . Die Hintergrundfarbe für <hr> färben wir entsprechend mit Farbwert #20b2aa. Dies geht in HTML nicht. Wir nutzen daher CSS.

<style type="text/css"><!--
  hr { border:4pt dotted #fff8dc; background-color:#20b2aa; }
//-->
</style>

Mehr zu hr lesen Sie in Grundlegende Gestaltungselemente in HTML. Weiteres zum HTML-Tag <hr>.