Ressourcen: 120 HTML Farbnamen - Kombination von Farbe chartreuse und Farbwert #00ced1

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 chartreuse			Schriftfarbwert #00ced1
Detail	:	Hintergrund chartreuse	Detail	:	Schrift #00ced1
Farbe	:	chartreuse	Farbwert	:	#00ced1
Farbwert	:	#7fff00	Farbe	:	darkturquoise
HTML	:	chartreuse	HTML	:	#00ced1
HTML (Wert)	:	#7fff00	HTML (Wert)	:	#00ced1
CSS	:	chartreuse	CSS	:	#00ced1
CSS (Wert)	:	#7fff00	CSS (Wert)	:	#00ced1
CSS (kürzest)	:	#7fff00	CSS (kürzest)	:	#00ced1
CSS (RGB)	:	rgb(127,255,0)	CSS (RGB)	:	rgb(0,206,209)
CSS (%RGB)	:	rgb(49%,100%,0%)	CSS (%RGB)	:	rgb(0%,80%,81%)

Verlauf Hintergrundfarbe chartreuse nach Schriftfarbwert #00ced1
#7fff00	#6cf81d	#5af13b	#48ea59	#36e377	#24dc95	#12d5b3	#00ced1
#7fff00	#6cf81d	#5af13b	#48ea59	#36e377	#24dc95	#12d5b3	#00ced1

Kombination von chartreuse und #00ced1
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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				#00ced1 eignet sich nicht als Schriftfarbe auf Hintergrund chartreuse, weil weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind. Die Ähnlichkeit der Farben #00ced1 und chartreuse ergibt sich zu 92.82%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 7.18%.

Hintergrundfarbe chartreuse				Schriftfarbwert #00ced1
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#7fff00	#7fff00	#7fff00	#7fff00	#00ced1	#00ced1	#00ced1	#00ced1
#91ff24	#91ff24	#6cda00	#6cda00	#24d5d7	#24d5d7	#00b0b3	#00b0b3
#a3ff48	#a3ff48	#5ab600	#5ab600	#48dcde	#48dcde	#009395	#009395
#b5ff6d	#b5ff6d	#489100	#489100	#6de3e4	#6de3e4	#007577	#007577
#c8ff91	#c8ff91	#366d00	#366d00	#91eaeb	#91eaeb	#005859	#005859
#daffb6	#daffb6	#244800	#244800	#b6f1f1	#b6f1f1	#003a3b	#003a3b
#ecffda	#ecffda	#122400	#122400	#daf8f8	#daf8f8	#001d1d	#001d1d
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe chartreuse und Farbwert #00ced1

Wechsel der Textfarbe bei Hover bei Befehl q

Die Textfarbe soll sich von Farbe chartreuse auf Farbwert #00ced1 ändern, wenn man mit der Maus auf <q> zeigt. Wir bereiten zunächst eine Formatierung von <q> in Farbe chartreuse vor.

Für dieses Beispiel legen wir bei <q> die Textfarbe auf Farbe chartreuse fest. Die Hintergrundfarbe behalten wir bei. Die Schriftart setzen wir auf arial:

<style type="text/css"><!--
  q { 
    font-family:arial; 
    color:chartreuse;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Textfarbe auf #00ced1 geändert wird.

<style type="text/css"><!--
  q: hover { 
    color: #00ced1;
  }
//-->
</style>

Möglichkeiten des HTML-Befehl q sind in der HTML Referenz bei <q> ausführlich zusammengestellt.

Zebra-Effekt bei HTML-Tag td

Werden zwei Farben abweselnd als Hintergrundfarbe verwendet, spricht man von einem Zebra-Effekt. Der Effekt unterstützt das Auge zum Beispiel die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ger und .ung für <td> mit den Hintergrundfarben Farbe chartreuse und Farbwert #00ced1.

<style type="text/css"><!--
  td.ger { 
    background-color: chartreuse;
  }
  td.ung { 
    background-color: #00ced1;
  }
//-->
</style>

Diese werden abwechselnd verwendet.

<table>
<tr><td class="ger"><tt>A/A</td><td class="ung"></tt>B/A</td><td class="ger"><tt>C/A</td></tr>
<tr><td class="ger"></tt>A/B</td><td class="ung"><tt>B/B</td><td class="ger"></tt>C/B</td></tr>
<tr><td class="ger"><tt>A/C</td><td class="ung"></tt>B/C</td><td class="ger">@C/C</td></tr>
</table>

Weiteres zum Thema finden Sie in Tabellen in HTML. Weiteres zum hier genutzten HTML-Befehl <td>.