Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #dda0dd und Farbwert #8a2be2

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.

Hintergrundfarbwert #dda0dd			Schriftfarbwert #8a2be2
Detail	:	Hintergrund #dda0dd	Detail	:	Schrift #8a2be2
Farbwert	:	#dda0dd	Farbwert	:	#8a2be2
Farbe	:	plum	Farbe	:	blueviolet
HTML	:	#dda0dd	HTML	:	#8a2be2
HTML (Wert)	:	#dda0dd	HTML (Wert)	:	#8a2be2
CSS	:	#dda0dd	CSS	:	#8a2be2
CSS (Wert)	:	#dda0dd	CSS (Wert)	:	#8a2be2
CSS (kürzest)	:	#dda0dd	CSS (kürzest)	:	#8a2be2
CSS (RGB)	:	rgb(221,160,221)	CSS (RGB)	:	rgb(138,43,226)
CSS (%RGB)	:	rgb(86%,62%,86%)	CSS (%RGB)	:	rgb(54%,16%,88%)

Verlauf Hintergrundfarbwert #dda0dd nach Schriftfarbwert #8a2be2
#dda0dd	#d18fdd	#c57ede	#b96ddf	#ad5ddf	#a14ce0	#953be1	#8a2be2
#dda0dd	#d18fdd	#c57ede	#b96ddf	#ad5ddf	#a14ce0	#953be1	#8a2be2

Kombination von #dda0dd und #8a2be2
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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				#8a2be2 ist nicht als Schriftfarbe auf Hintergrund #dda0dd geeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind geeignet. Die Ähnlichkeit von #8a2be2 und #dda0dd ergibt sich zu 86.29%. Die Lesbarkeit dieser Kombination bewerte ich mit 13.71%.

Hintergrundfarbwert #dda0dd				Schriftfarbwert #8a2be2
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#dda0dd	#dda0dd	#dda0dd	#dda0dd	#8a2be2	#8a2be2	#8a2be2	#8a2be2
#e1ade1	#e1ade1	#bd89bd	#bd89bd	#9a49e6	#9a49e6	#7624c1	#7624c1
#e6bbe6	#e6bbe6	#9d729d	#9d729d	#ab67ea	#ab67ea	#621ea1	#621ea1
#ebc8eb	#ebc8eb	#7e5b7e	#7e5b7e	#bc85ee	#bc85ee	#4e1881	#4e1881
#f0d6f0	#f0d6f0	#5e445e	#5e445e	#cca4f2	#cca4f2	#3b1260	#3b1260
#f5e3f5	#f5e3f5	#3f2d3f	#3f2d3f	#ddc2f6	#ddc2f6	#270c40	#270c40
#faf1fa	#faf1fa	#1f161f	#1f161f	#eee0fa	#eee0fa	#130620	#130620
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #dda0dd und Farbwert #8a2be2

Wechsel der Umrandung bei Hover von HTML-Befehl pre

Die Rahmenfarbe soll sich von Farbwert #dda0dd auf Farbwert #8a2be2 ändern, wenn man mit der Maus auf <pre> zeigt. Wir bereiten zunächst die Darstellung von <pre> in Farbwert #dda0dd vor.

In diesem Beispiel umranden wir <pre> mit einem 3 Pixel dicken, doppelten Rahmen in Farbwert #dda0dd.

<style type="text/css"><!--
  pre { 
    border-style: double; 
    border-color: #dda0dd; 
    border-width: 3px;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Mausberührung die Rahmenfarbe auf #8a2be2 ändert.

<style type="text/css"><!--
  pre:hover { 
    border-color:#8a2be2;
  }
//-->
</style>

Weiteres zum Thema können Sie in Blockorientierte Elemente in HTML lesen. Zur Beschreibung vom hier gezeigten HTML-Tag <pre>.

Wechsel der Hintergrundfarbe bei Hover bei Tag h1

Eine Überschrift der 1. Stufe wird mit HTML-Tag <h1> gesetzt. Sie kann farblich gestaltet werden.

Die Hintergrundfarbe soll sich von Farbwert #dda0dd auf Farbwert #8a2be2 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <h1> in Farbwert #dda0dd vor.

Für dieses Beispiel ändern wir bei <h1> die Hintergrundfarbe auf Farbwert #dda0dd und ändern die Schriftgröße auf 13px.

<style type="text/css"><!--
  h1 { 
    background-color: #dda0dd; 
    font-size: 13px;
  }
//-->
</style>

Nun stellen wir ein, dass bei Berührung mit der Maus die Hintergrundfarbe auf #8a2be2 gesetzt wird.

<style type="text/css"><!--
  h1:hover { 
    background-color:#8a2be2;
  }
//-->
</style>

Weiteres zum Thema können Sie in Grundlegende Gestaltungselemente in HTML nachlesen. Die Beschreibung des hier gezeigten HTML-Tag h1 finden Sie in der HTML Referenz unter <h1>.