Ressourcen: 137 HTML Farbnamen - Kombination von Farbe indigo und Farbwert #a52a2a

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 indigo			Schriftfarbwert #a52a2a
Detail	:	Hintergrund indigo	Detail	:	Schrift #a52a2a
Farbe	:	indigo	Farbwert	:	#a52a2a
Farbwert	:	#4b0082	Farbe	:	brown
HTML	:	indigo	HTML	:	#a52a2a
HTML (Wert)	:	#4b0082	HTML (Wert)	:	#a52a2a
CSS	:	indigo	CSS	:	#a52a2a
CSS (Wert)	:	#4b0082	CSS (Wert)	:	#a52a2a
CSS (kürzest)	:	#4b0082	CSS (kürzest)	:	#a52a2a
CSS (RGB)	:	rgb(75,0,130)	CSS (RGB)	:	rgb(165,42,42)
CSS (%RGB)	:	rgb(29%,0%,50%)	CSS (%RGB)	:	rgb(64%,16%,16%)

Verlauf Hintergrundfarbe indigo nach Schriftfarbwert #a52a2a
#4b0082	#570675	#640c68	#71125c	#7e184f	#8b1e43	#982436	#a52a2a
#4b0082	#570675	#640c68	#71125c	#7e184f	#8b1e43	#982436	#a52a2a

Kombination von indigo und #a52a2a
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				#a52a2a eignet sich nicht als Schriftfarbe auf Hintergrund indigo, da weder der Helligkeitsunterschied noch der Farbunterschied ausreichend sind. Die Ähnlichkeit der Farben #a52a2a und indigo beträgt 91.29%. Die Lesbarkeit dieser Kombination bewerte ich mit 8.71%.

Hintergrundfarbe indigo				Schriftfarbwert #a52a2a
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#4b0082	#4b0082	#4b0082	#4b0082	#a52a2a	#a52a2a	#a52a2a	#a52a2a
#642493	#642493	#40006f	#40006f	#b14848	#b14848	#8d2424	#8d2424
#7e48a5	#7e48a5	#35005c	#35005c	#be6666	#be6666	#751e1e	#751e1e
#986db7	#986db7	#2a004a	#2a004a	#cb8585	#cb8585	#5e1818	#5e1818
#b191c9	#b191c9	#200037	#200037	#d8a3a3	#d8a3a3	#461212	#461212
#cbb6db	#cbb6db	#150025	#150025	#e5c2c2	#e5c2c2	#2f0c0c	#2f0c0c
#e5daed	#e5daed	#0a0012	#0a0012	#f2e0e0	#f2e0e0	#170606	#170606
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe indigo und Farbwert #a52a2a

Wechsel der Textfarbe bei Hover von Tag q

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

Wir setzen für dieses Beispiel die Textfarbe von <q> auf Farbe indigo. Die Hintergrundfarbe behalten wir bei, setzen jedoch die Schriftart auf courier new. Die Größe der Schrift erhöhen wir auf 126%:

<style type="text/css"><!--
  q { 
    font-family: courier new; 
    font-size: 126%; 
    color: indigo;
  }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Textfarbe auf #a52a2a gesetzt wird.

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

Weiteres zum Tag <q>.

Zebra-Effekt mit Tag tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, redet man vom so genannten 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 <tr> mit den Hintergrundfarben Farbe indigo und Farbwert #a52a2a.

<style type="text/css"><!--
  tr.ger { 
    background-color: indigo;
  }
  tr.ung { 
    background-color:#a52a2a;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd genutzt.

<table>
<tr class="ger"><td>OA:A</td><td>OB:A</td><td>OC:A</td></tr>
<tr class="ung"><td>OA:B</td><td>OB:B</td><td>OC:B</td></tr>
<tr class="ger"><td>OA:C</td><td>OB:C</td><td>OC:C</td></tr>
</table>

Mehr zum Thema finden Sie in Tabellen in HTML. Einzelheiten des Tag tr sind in der HTML Referenz unter <tr> zusammengestellt.