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

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 tomato			Schriftfarbe turquoise
Detail	:	Hintergrund tomato	Detail	:	Schrift turquoise
Farbe	:	tomato	Farbe	:	turquoise
Farbwert	:	#ff6347	Farbwert	:	#40e0d0
HTML	:	tomato	HTML	:	turquoise
HTML (Wert)	:	#ff6347	HTML (Wert)	:	#40e0d0
CSS	:	tomato	CSS	:	turquoise
CSS (Wert)	:	#ff6347	CSS (Wert)	:	#40e0d0
CSS (kürzest)	:	#ff6347	CSS (kürzest)	:	#40e0d0
CSS (RGB)	:	rgb(255,99,71)	CSS (RGB)	:	rgb(64,224,208)
CSS (%RGB)	:	rgb(100%,38%,27%)	CSS (%RGB)	:	rgb(25%,87%,81%)

Verlauf Hintergrundfarbe tomato nach Schriftfarbe turquoise
#ff6347	#e3745a	#c8866e	#ad9881	#91aa95	#76bca8	#5bcebc	#40e0d0
#ff6347	#e3745a	#c8866e	#ad9881	#91aa95	#76bca8	#5bcebc	#40e0d0

Kombination von tomato und turquoise
Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit der Farben turquoise und tomato ergibt sich zu 91.45%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 8.55%. turquoise ist nicht als Schriftfarbe auf Hintergrund tomato geeignet. Die Unterschiede in der Helligkeit und Farbe sind zu gering.

Hintergrundfarbe tomato				Schriftfarbe turquoise
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ff6347	#ff6347	#ff6347	#ff6347	#40e0d0	#40e0d0	#40e0d0	#40e0d0
#ff7961	#ff7961	#da543c	#da543c	#5be4d6	#5be4d6	#36c0b2	#36c0b2
#ff8f7b	#ff8f7b	#b64632	#b64632	#76e8dd	#76e8dd	#2da094	#2da094
#ffa595	#ffa595	#913828	#913828	#91ede4	#91ede4	#248076	#248076
#ffbcb0	#ffbcb0	#6d2a1e	#6d2a1e	#adf1ea	#adf1ea	#1b6059	#1b6059
#ffd2ca	#ffd2ca	#481c14	#481c14	#c8f6f1	#c8f6f1	#12403b	#12403b
#ffe8e4	#ffe8e4	#240e0a	#240e0a	#e3faf8	#e3faf8	#09201d	#09201d
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe tomato und Farbe turquoise

Wechsel der Unterstreichung bei Hover bei Tag s

Die Farbe der Unterstreichung soll sich von Farbe tomato auf Farbe turquoise ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <s> in Farbe tomato vor.

Hier unterstreichen wir <s> mit einem gestrichelten Rahmen mit 4 Pixel Dicke in Farbe tomato.

<style type="text/css"><!--
  s { 
    border-bottom-style: dashed; 
    border-bottom-width: 4px; 
    border-bottom-color: tomato;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Hover die Unterstreichungsfarbe zu turquoise ändert.

<style type="text/css"><!--
  s: hover { 
    border-bottom-color: turquoise;
  }
//-->
</style>

Die Idee ist, unabhängige Formatierungen für Inhalt und Unterstreichung zu verwenden. Manchmal sehen Sie diesen Effekt bei Hyperlinks. Der Text ist in einer Farbe. Und die Unterstreichung in einer anderen. Es ist aber keine "normale" Unterstreichung, der Text selbst hat gar keine Unterstreichung. Sie wird mit einem Rahmen simuliert und dieser Rahmen ist unabhängig vom Text.

Weiteres zum Thema erfahren Sie in Text in HTML. Mehr zum hier genutzten HTML-Befehl s ist in der HTML Referenz unter <s> zusammengestellt.

Hintergrund/Text-Kombination von Befehl code

In diesem Beispiel ändern wir die Textfarbe von <code> auf Farbe turquoise und die Hintergrundfarbe von <code> auf Farbe tomato. Die Schriftart ändern wir auf verdana und verkleinern die Schriftgröße auf 84%.

<style type="text/css"><!--
  code { 
    font-family: verdana; 
    font-size: 84%; 
    background-color: tomato; 
    color: turquoise;
  }
//-->
</style>

Weiteres zum Thema code erfahren Sie in Text in HTML. Möglichkeiten vom hier gezeigten HTML-Befehl <code>.