Ressourcen: 137 HTML Farbnamen - Kombination von Farbe teal und Farbe papayawhip

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 teal			Schriftfarbe papayawhip
Detail	:	Hintergrund teal	Detail	:	Schrift papayawhip
Farbe	:	teal	Farbe	:	papayawhip
Farbwert	:	#008080	Farbwert	:	#ffefd5
HTML	:	teal	HTML	:	papayawhip
HTML (Wert)	:	#008080	HTML (Wert)	:	#ffefd5
CSS	:	teal	CSS	:	papayawhip
CSS (Wert)	:	#008080	CSS (Wert)	:	#ffefd5
CSS (kürzest)	:	#008080	CSS (kürzest)	:	#ffefd5
CSS (RGB)	:	rgb(0,128,128)	CSS (RGB)	:	rgb(255,239,213)
CSS (%RGB)	:	rgb(0%,50%,50%)	CSS (%RGB)	:	rgb(100%,93%,83%)

Verlauf Hintergrundfarbe teal nach Schriftfarbe papayawhip
#008080	#248f8c	#489f98	#6dafa4	#91bfb0	#b6cfbc	#dadfc8	#ffefd5
#008080	#248f8c	#489f98	#6dafa4	#91bfb0	#b6cfbc	#dadfc8	#ffefd5

Kombination von teal und papayawhip
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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras vestibulum tristique erat, ac interdum justo cursus in.				papayawhip eignet sich nicht als Schriftfarbe auf Hintergrund teal. Zwar ist der Helligkeitsunterschied in Ordnung, doch die Farben selbst sind zu ähnlich. Die Ähnlichkeit von papayawhip und teal beträgt 79.91%. Die Lesbarkeit dieser Farbkombination liegt damit bei 20.09%.

Hintergrundfarbe teal				Schriftfarbe papayawhip
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#008080	#008080	#008080	#008080	#ffefd5	#ffefd5	#ffefd5	#ffefd5
#249292	#249292	#006d6d	#006d6d	#fff1db	#fff1db	#daccb6	#daccb6
#48a4a4	#48a4a4	#005b5b	#005b5b	#fff3e1	#fff3e1	#b6aa98	#b6aa98
#6db6b6	#6db6b6	#004949	#004949	#fff5e7	#fff5e7	#918879	#918879
#91c8c8	#91c8c8	#003636	#003636	#fff8ed	#fff8ed	#6d665b	#6d665b
#b6dada	#b6dada	#002424	#002424	#fffaf3	#fffaf3	#48443c	#48443c
#daecec	#daecec	#001212	#001212	#fffcf9	#fffcf9	#24221e	#24221e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe teal und Farbe papayawhip

Wechsel der Textfarbe bei Hover mit HTML-Befehl strike

Die Textfarbe soll sich von Farbe teal auf Farbe papayawhip ändern, wenn man mit der Maus auf <strike> zeigt. Wir bereiten zunächst eine Formatierung von <strike> in Farbe teal vor.

Wir ändern zum Beispiel die Textfarbe von <strike> auf Farbe teal. Zwar behalten wir die Hintergrundfarbe bei, setzen jedoch die Schriftart auf monospace. Die Größe der Schrift ändern wir auf 13px:

<style type="text/css"><!--
  strike { 
    color:teal; 
    font-family:monospace; 
    font-size:13px;
  }
//-->
</style>

Nun fordern wir, dass bei Mausberührung die Textfarbe auf papayawhip geändert wird.

<style type="text/css"><!--
  strike:hover { 
    color:papayawhip;
  }
//-->
</style>

Mehr zum Thema strike finden Sie in Text in HTML. Einzelheiten des Befehl strike erfahren Sie in der HTML Referenz unter <strike>.

Wechsel der Unterstreichung bei Hover mit HTML-Befehl label

Die Unterstreichungsfarbe soll sich von Farbe teal auf Farbe papayawhip ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <label> in Farbe teal vor.

Beispielsweise unterstreichen wir <label> mit Hilfe eines gefurchten Rahmens mit 2 Pixel Dicke in Farbe teal.

<style type="text/css"><!--
  label { 
    border-bottom-color:teal; 
    border-bottom-width:2px; 
    border-bottom-style:groove;
  }
//-->
</style>

Nun stellen wir ein, dass bei Mausberührung die Farbe der Unterstreichung auf papayawhip gesetzt wird.

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

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu verwenden. Manchmal sehen Sie diesen Effekt bei Hyperlinks. Der Text ist in einer Farbe. Die Unterstreichung in einer anderen. Dies ist jedoch keine "normale" Unterstreichung, der Text hat keine Unterstreichung. Sie wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Weiteres zu label können Sie in Formulare in HTML nachlesen. Der hier gezeigte Befehl label ist in der HTML Referenz unter <label> ausführlich gezeigt.