Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #cd5c5c und Farbwert #a0522d

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.

Hintergrundfarbwert #cd5c5c			Schriftfarbwert #a0522d
Detail	:	Hintergrund #cd5c5c	Detail	:	Schrift #a0522d
Farbwert	:	#cd5c5c	Farbwert	:	#a0522d
Farbe	:	indianred	Farbe	:	sienna
HTML	:	#cd5c5c	HTML	:	#a0522d
HTML (Wert)	:	#cd5c5c	HTML (Wert)	:	#a0522d
CSS	:	#cd5c5c	CSS	:	#a0522d
CSS (Wert)	:	#cd5c5c	CSS (Wert)	:	#a0522d
CSS (kürzest)	:	#cd5c5c	CSS (kürzest)	:	#a0522d
CSS (RGB)	:	rgb(205,92,92)	CSS (RGB)	:	rgb(160,82,45)
CSS (%RGB)	:	rgb(80%,36%,36%)	CSS (%RGB)	:	rgb(62%,32%,17%)

Verlauf Hintergrundfarbwert #cd5c5c nach Schriftfarbwert #a0522d
#cd5c5c	#c65a55	#c0594e	#b95747	#b35641	#ac543a	#a65333	#a0522d
#cd5c5c	#c65a55	#c0594e	#b95747	#b35641	#ac543a	#a65333	#a0522d

Kombination von #cd5c5c und #a0522d
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in. 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 id velit ante.				#a0522d ist nicht als Schriftfarbe auf Hintergrund #cd5c5c geeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind geeignet. Die Ähnlichkeit der Farben #a0522d und #cd5c5c ergibt sich zu 93.27%. Die Lesbarkeit dieser Kombination ergibt sich zu 6.73%.

Hintergrundfarbwert #cd5c5c				Schriftfarbwert #a0522d
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#cd5c5c	#cd5c5c	#cd5c5c	#cd5c5c	#a0522d	#a0522d	#a0522d	#a0522d
#d47373	#d47373	#af4e4e	#af4e4e	#ad6a4b	#ad6a4b	#894626	#894626
#db8a8a	#db8a8a	#924141	#924141	#bb8369	#bb8369	#723a20	#723a20
#e2a1a1	#e2a1a1	#753434	#753434	#c89c87	#c89c87	#5b2e19	#5b2e19
#e9b9b9	#e9b9b9	#572727	#572727	#d6b4a5	#d6b4a5	#442313	#442313
#f0d0d0	#f0d0d0	#3a1a1a	#3a1a1a	#e3cdc3	#e3cdc3	#2d170c	#2d170c
#f7e7e7	#f7e7e7	#1d0d0d	#1d0d0d	#f1e6e1	#f1e6e1	#160b06	#160b06
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #cd5c5c und Farbwert #a0522d

Wechsel der Textfarbe bei Hover bei Tag h6

Eine Überschrift erzeugen Sie mit HTML-Tag <h6>. Diese kann farblich gestaltet werden.

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

Für dieses Beispiel ändern wir die Textfarbe von <h6> auf Farbwert #cd5c5c. Die Hintergrundfarbe ändern wir nicht, setzen jedoch die Schriftart auf sans-serif und vergrößern die Größe der Schrift auf 129%:

<style type="text/css"><!--
  h6 { 
    font-size: 129%; 
    color: #cd5c5c; 
    font-family: sans-serif;
  }
//-->
</style>

Jetzt fordern wir, dass sich bei Berührung mit der Maus die Textfarbe zu #a0522d ändert.

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

Mehr zum Thema erfahren Sie in Grundlegende Gestaltungselemente in HTML. Der hier verwendete Tag h6 ist in der HTML Referenz unter <h6> zusammengestellt.

Text- und Unterstreichungsfarben bei HTML-Befehl h5

Eine Überschrift der 5. Stufe erzeugen Sie mit Tag <h5>. Diese können Sie farblich gestalten.

Für dieses Beispiel ändern wir die Textfarbe von <h5> auf Farbwert #a0522d und lassen die Hintergrundfarbe unverändert. Die Schriftart setzen wir auf verdana. Die Schriftgröße erhöhen wir auf 127%. Wir unterstreichen den Inhalt von <h5> mit Hilfe eines einfallenden Rahmens mit 3 Pixel Dicke in Farbwert #cd5c5c. Dies ist in HTML kaum möglich. Daher nutzen wir hierfür CSS.

<style type="text/css"><!--
  h5 { 
    color: #a0522d; 
    border-bottom-style: inset; 
    border-bottom-color: #cd5c5c; 
    border-bottom-width: 3px; 
    font-size: 127%; 
    font-family: verdana;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben.

Mehr zum Thema h5 erfahren Sie in Grundlegende Gestaltungselemente in HTML. Weiteres zum hier gezeigten HTML-Tag h5 ist in der HTML Referenz unter <h5> gezeigt.