Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ff7f50 und Farbe violet

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 #ff7f50			Schriftfarbe violet
Detail	:	Hintergrund #ff7f50	Detail	:	Schrift violet
Farbwert	:	#ff7f50	Farbe	:	violet
Farbe	:	coral	Farbwert	:	#ee82ee
HTML	:	#ff7f50	HTML	:	violet
HTML (Wert)	:	#ff7f50	HTML (Wert)	:	#ee82ee
CSS	:	#ff7f50	CSS	:	violet
CSS (Wert)	:	#ff7f50	CSS (Wert)	:	#ee82ee
CSS (kürzest)	:	#ff7f50	CSS (kürzest)	:	#ee82ee
CSS (RGB)	:	rgb(255,127,80)	CSS (RGB)	:	rgb(238,130,238)
CSS (%RGB)	:	rgb(100%,49%,31%)	CSS (%RGB)	:	rgb(93%,50%,93%)

Verlauf Hintergrundfarbwert #ff7f50 nach Schriftfarbe violet
#ff7f50	#fc7f66	#fa7f7d	#f78093	#f580aa	#f281c0	#f081d7	#ee82ee
#ff7f50	#fc7f66	#fa7f7d	#f78093	#f580aa	#f281c0	#f081d7	#ee82ee

Kombination von #ff7f50 und violet
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. Cras id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				violet ist nicht als Schriftfarbe auf Hintergrund #ff7f50 geeignet, weil weder der Helligkeitsunterschied noch der Farbunterschied gross genug sind. Die Ähnlichkeit der Farben violet und #ff7f50 beträgt 94.86%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 5.14%.

Hintergrundfarbwert #ff7f50				Schriftfarbe violet
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ff7f50	#ff7f50	#ff7f50	#ff7f50	#ee82ee	#ee82ee	#ee82ee	#ee82ee
#ff9169	#ff9169	#da6c44	#da6c44	#f093f0	#f093f0	#cc6fcc	#cc6fcc
#ffa382	#ffa382	#b65a39	#b65a39	#f2a5f2	#f2a5f2	#aa5caa	#aa5caa
#ffb59b	#ffb59b	#91482d	#91482d	#f5b7f5	#f5b7f5	#884a88	#884a88
#ffc8b4	#ffc8b4	#6d3622	#6d3622	#f7c9f7	#f7c9f7	#663766	#663766
#ffdacd	#ffdacd	#482416	#482416	#fadbfa	#fadbfa	#442544	#442544
#ffece6	#ffece6	#24120b	#24120b	#fcedfc	#fcedfc	#221222	#221222
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ff7f50 und Farbe violet

Wechsel der Umrandung bei Hover von HTML-Tag span

Die Rahmenfarbe soll sich von Farbwert #ff7f50 auf Farbe violet ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <span> in Farbwert #ff7f50 vor.

In diesem Beispiel umranden wir <span> mit einem 3 Pixel dicken, gefurchten Rahmen in Farbwert #ff7f50.

<style type="text/css"><!--
  span { border:3px groove #ff7f50; }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Rahmenfarbe auf violet geändert wird.

<style type="text/css"><!--
  span: hover { 
    border-color: violet;
  }
//-->
</style>

Beschreibung vom hier genutzten Tag <span>.

Text- und Unterstreichungsfarben mit HTML-Befehl s

Wir ändern für dieses Beispiel die Textfarbe von <s> auf Farbe violet. Die Schriftart setzen wir auf verdana. Die Schriftgröße setzen wir auf 84%. Wir unterstreichen den Inhalt von <s> mit Hilfe eines einfallenden Rahmens mit 3 Pixel Dicke in Farbwert #ff7f50. Dies geht mit HTML nicht. Daher verwenden wir dafür CSS.

<style type="text/css"><!--
  s { 
    border-bottom-width:3px; 
    font-size:84%; 
    border-bottom-style:inset; 
    color:violet; 
    border-bottom-color:#ff7f50; 
    font-family:verdana;
  }
//-->
</style>

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

Mehr zum Thema lesen Sie in Text in HTML. Weiteres zum Tag s finden Sie in der HTML Referenz unter <s>.