Ressourcen: 120 HTML Farbnamen - Kombination von Farbe lightseagreen und Farbe tomato

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.

Hintergrundfarbe lightseagreen			Schriftfarbe tomato
Detail	:	Hintergrund lightseagreen	Detail	:	Schrift tomato
Farbe	:	lightseagreen	Farbe	:	tomato
Farbwert	:	#20b2aa	Farbwert	:	#ff6347
HTML	:	lightseagreen	HTML	:	tomato
HTML (Wert)	:	#20b2aa	HTML (Wert)	:	#ff6347
CSS	:	lightseagreen	CSS	:	tomato
CSS (Wert)	:	#20b2aa	CSS (Wert)	:	#ff6347
CSS (kürzest)	:	#20b2aa	CSS (kürzest)	:	#ff6347
CSS (RGB)	:	rgb(32,178,170)	CSS (RGB)	:	rgb(255,99,71)
CSS (%RGB)	:	rgb(12%,69%,66%)	CSS (%RGB)	:	rgb(100%,38%,27%)

Verlauf Hintergrundfarbe lightseagreen nach Schriftfarbe tomato
#20b2aa	#3fa69b	#5f9b8d	#7f907f	#9f8471	#bf7963	#df6e55	#ff6347
#20b2aa	#3fa69b	#5f9b8d	#7f907f	#9f8471	#bf7963	#df6e55	#ff6347

Kombination von lightseagreen und tomato
Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras vestibulum tristique erat, ac interdum justo cursus in.				tomato eignet sich nicht als Schriftfarbe auf Hintergrund lightseagreen, weil sich die Helligkeit und Farben zu ähnlich sind. Die Ähnlichkeit der Farben tomato und lightseagreen ergibt sich zu 94.65%. Die Lesbarkeit dieser Kombination bewerte ich mit 5.35%.

Hintergrundfarbe lightseagreen				Schriftfarbe tomato
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#20b2aa	#20b2aa	#20b2aa	#20b2aa	#ff6347	#ff6347	#ff6347	#ff6347
#3fbdb6	#3fbdb6	#1b9891	#1b9891	#ff7961	#ff7961	#da543c	#da543c
#5fc8c2	#5fc8c2	#167f79	#167f79	#ff8f7b	#ff8f7b	#b64632	#b64632
#7fd3ce	#7fd3ce	#126561	#126561	#ffa595	#ffa595	#913828	#913828
#9fdeda	#9fdeda	#0d4c48	#0d4c48	#ffbcb0	#ffbcb0	#6d2a1e	#6d2a1e
#bfe9e6	#bfe9e6	#093230	#093230	#ffd2ca	#ffd2ca	#481c14	#481c14
#dff4f2	#dff4f2	#041918	#041918	#ffe8e4	#ffe8e4	#240e0a	#240e0a
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe lightseagreen und Farbe tomato

Wechsel der Hintergrundfarbe bei Hover von HTML-Befehl h4

Eine Überschrift der 4. Stufe wird mit HTML-Tag <h4> erzeugt. Diese kann man farblich gestalten.

Die Hintergrundfarbe soll sich von Farbe lightseagreen auf Farbe tomato ändern, wenn man mit der Maus auf <h4> zeigt. Wir bereiten zunächst die Darstellung von <h4> in Farbe lightseagreen vor.

Hier legen wir Farbe lightseagreen als Hintergrundfarbe von <h4> fest.

<style type="text/css"><!--
  h4 { 
    background-color:lightseagreen;
  }
//-->
</style>

Nun fordern wir, dass bei Berührung mit der Maus die Hintergrundfarbe auf tomato geändert wird.

<style type="text/css"><!--
  h4:hover { 
    background-color:tomato;
  }
//-->
</style>

Mehr zu h4 können Sie in Grundlegende Gestaltungselemente in HTML lesen. Weiteres zum HTML-Tag h4 ist in der HTML Referenz unter <h4> genau beschrieben.

Hintergrund/Text-Kombination von HTML-Befehl select

Wir ändern hier die Textfarbe von <select> auf Farbe tomato und die Hintergrundfarbe von <select> auf Farbe lightseagreen. Als Schriftart wählen wir verdana. Die Schriftgröße verkleinern wir auf 85%.

<style type="text/css"><!--
  select { 
    background-color:lightseagreen; 
    color:tomato; 
    font-family:verdana; 
    font-size:85%;
  }
//-->
</style>

Mehr zu select finden Sie in Formulare in HTML. Möglichkeiten des hier verwendeten HTML-Befehl select sind in der HTML Referenz bei <select> beschrieben.