Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #2f4f4f 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 #2f4f4f			Schriftfarbe violet
Detail	:	Hintergrund #2f4f4f	Detail	:	Schrift violet
Farbwert	:	#2f4f4f	Farbe	:	violet
Farbe	:	darkslategray	Farbwert	:	#ee82ee
HTML	:	#2f4f4f	HTML	:	violet
HTML (Wert)	:	#2f4f4f	HTML (Wert)	:	#ee82ee
CSS	:	#2f4f4f	CSS	:	violet
CSS (Wert)	:	#2f4f4f	CSS (Wert)	:	#ee82ee
CSS (kürzest)	:	#2f4f4f	CSS (kürzest)	:	#ee82ee
CSS (RGB)	:	rgb(47,79,79)	CSS (RGB)	:	rgb(238,130,238)
CSS (%RGB)	:	rgb(18%,30%,30%)	CSS (%RGB)	:	rgb(93%,50%,93%)

Verlauf Hintergrundfarbwert #2f4f4f nach Schriftfarbe violet
#2f4f4f	#4a5665	#655d7c	#806493	#9c6ca9	#b773c0	#d27ad7	#ee82ee
#2f4f4f	#4a5665	#655d7c	#806493	#9c6ca9	#b773c0	#d27ad7	#ee82ee

Kombination von #2f4f4f und violet
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante.				violet eignet sich nicht als Schriftfarbe auf Hintergrund #2f4f4f, weil die Helligkeit und Farben zu ähnlich sind. Die Ähnlichkeit von violet und #2f4f4f ergibt sich zu 81.65%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 18.35%.

Hintergrundfarbwert #2f4f4f				Schriftfarbe violet
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#2f4f4f	#2f4f4f	#2f4f4f	#2f4f4f	#ee82ee	#ee82ee	#ee82ee	#ee82ee
#4c6868	#4c6868	#284343	#284343	#f093f0	#f093f0	#cc6fcc	#cc6fcc
#6a8181	#6a8181	#213838	#213838	#f2a5f2	#f2a5f2	#aa5caa	#aa5caa
#889a9a	#889a9a	#1a2d2d	#1a2d2d	#f5b7f5	#f5b7f5	#884a88	#884a88
#a5b3b3	#a5b3b3	#142121	#142121	#f7c9f7	#f7c9f7	#663766	#663766
#c3cccc	#c3cccc	#0d1616	#0d1616	#fadbfa	#fadbfa	#442544	#442544
#e1e5e5	#e1e5e5	#060b0b	#060b0b	#fcedfc	#fcedfc	#221222	#221222
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #2f4f4f und Farbe violet

Wechsel der Textfarbe bei Hover mit Befehl address

Die Textfarbe soll sich von Farbwert #2f4f4f auf Farbe violet ändern, wenn man mit der Maus auf <address> zeigt. Bereiten wir zunächst die Formatierung von <address> in Farbwert #2f4f4f vor.

Als Beispiel legen wir Farbwert #2f4f4f als Textfarbe von <address> fest. Zwar behalten wir die Hintergrundfarbe bei, ändern jedoch die Schriftart auf monospace und setzen die Schriftgröße auf 9pt.

<style type="text/css"><!--
  address { 
    color:#2f4f4f; 
    font-family:monospace; 
    font-size:9pt;
  }
//-->
</style>

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

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

Weiteres zu address erfahren Sie in Blockorientierte Elemente in HTML. Einzelheiten vom hier verwendeten HTML-Tag address sind in der HTML Referenz bei <address> genau beschrieben.

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag pre

Die Hintergrundfarbe soll sich von Farbwert #2f4f4f auf Farbe violet ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <pre> in Farbwert #2f4f4f vor.

Wir legen als Beispiel Farbwert #2f4f4f als Hintergrundfarbe von <pre> fest. Die Textfarbe lassen wir unverändert. Die Schriftart setzen wir auf sans-serif.

<style type="text/css"><!--
  pre { 
    font-family: sans-serif; 
    background-color: #2f4f4f;
  }
//-->
</style>

Jetzt fordern wir, dass bei Hover die Hintergrundfarbe auf violet gesetzt wird.

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

Weiteres zu pre können Sie in Blockorientierte Elemente in HTML nachlesen. Weiteres zum hier gezeigten HTML-Befehl <pre>.