Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ba55d3 und Farbwert #00ff7f

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 #ba55d3			Schriftfarbwert #00ff7f
Detail	:	Hintergrund #ba55d3	Detail	:	Schrift #00ff7f
Farbwert	:	#ba55d3	Farbwert	:	#00ff7f
Farbe	:	mediumorchid	Farbe	:	springgreen
HTML	:	#ba55d3	HTML	:	#00ff7f
HTML (Wert)	:	#ba55d3	HTML (Wert)	:	#00ff7f
CSS	:	#ba55d3	CSS	:	#00ff7f
CSS (Wert)	:	#ba55d3	CSS (Wert)	:	#00ff7f
CSS (kürzest)	:	#ba55d3	CSS (kürzest)	:	#00ff7f
CSS (RGB)	:	rgb(186,85,211)	CSS (RGB)	:	rgb(0,255,127)
CSS (%RGB)	:	rgb(72%,33%,82%)	CSS (%RGB)	:	rgb(0%,100%,49%)

Verlauf Hintergrundfarbwert #ba55d3 nach Schriftfarbwert #00ff7f
#ba55d3	#9f6dc7	#8485bb	#6a9daf	#4fb6a3	#35ce97	#1ae68b	#00ff7f
#ba55d3	#9f6dc7	#8485bb	#6a9daf	#4fb6a3	#35ce97	#1ae68b	#00ff7f

Kombination von #ba55d3 und #00ff7f
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante.				Die Ähnlichkeit der Farben #00ff7f und #ba55d3 beträgt 86.05%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 13.95%. #00ff7f ist nicht als Schriftfarbe auf Hintergrund #ba55d3 geeignet, weil weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind.

Hintergrundfarbwert #ba55d3				Schriftfarbwert #00ff7f
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ba55d3	#ba55d3	#ba55d3	#ba55d3	#00ff7f	#00ff7f	#00ff7f	#00ff7f
#c36dd9	#c36dd9	#9f48b4	#9f48b4	#24ff91	#24ff91	#00da6c	#00da6c
#cd85df	#cd85df	#843c96	#843c96	#48ffa3	#48ffa3	#00b65a	#00b65a
#d79de5	#d79de5	#6a3078	#6a3078	#6dffb5	#6dffb5	#009148	#009148
#e1b6ec	#e1b6ec	#4f245a	#4f245a	#91ffc8	#91ffc8	#006d36	#006d36
#ebcef2	#ebcef2	#35183c	#35183c	#b6ffda	#b6ffda	#004824	#004824
#f5e6f8	#f5e6f8	#1a0c1e	#1a0c1e	#daffec	#daffec	#002412	#002412
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ba55d3 und Farbwert #00ff7f

Wechsel der Hintergrundfarbe bei Hover bei HTML-Befehl center

Die Hintergrundfarbe soll sich von Farbwert #ba55d3 auf Farbwert #00ff7f ändern, wenn man mit der Maus auf <center> zeigt. Bereiten wir zunächst eine Darstellung von <center> in Farbwert #ba55d3 vor.

Wir setzen in diesem Beispiel bei <center> die Hintergrundfarbe auf Farbwert #ba55d3. Die Textfarbe behalten wir bei, setzen jedoch die Schriftart auf arial.

<style type="text/css"><!--
  center { 
    font-family: arial; 
    background-color: #ba55d3;
  }
//-->
</style>

Jetzt fordern wir, dass bei Mausberührung die Hintergrundfarbe auf #00ff7f gesetzt wird.

<style type="text/css"><!--
  center:hover { 
    background-color:#00ff7f;
  }
//-->
</style>

Mehr zum Thema center erfahren Sie in Grundlegende Gestaltungselemente in HTML. Mehr zum HTML-Tag center lesen Sie in der HTML Referenz unter <center>.

Hintergrund/Text-Kombination bei Tag label

Wir ändern für dieses Beispiel die Textfarbe von <label> auf Farbwert #00ff7f und die Hintergrundfarbe von <label> auf Farbwert #ba55d3. Die Schriftart setzen wir auf courier new. Die Schriftgröße setzen wir auf 113%.

<style type="text/css"><!--
  label { 
    font-size:113%; 
    color:#00ff7f; 
    font-family:courier new; 
    background-color:#ba55d3;
  }
//-->
</style>

Weiteres zu label finden Sie in Formulare in HTML. Mehr zum hier genutzten HTML-Tag label finden Sie in der HTML Referenz unter <label>.