Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ffc0cb und Farbwert #90ee90

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 #ffc0cb			Schriftfarbwert #90ee90
Detail	:	Hintergrund #ffc0cb	Detail	:	Schrift #90ee90
Farbwert	:	#ffc0cb	Farbwert	:	#90ee90
Farbe	:	pink	Farbe	:	lightgreen
HTML	:	#ffc0cb	HTML	:	#90ee90
HTML (Wert)	:	#ffc0cb	HTML (Wert)	:	#90ee90
CSS	:	#ffc0cb	CSS	:	#90ee90
CSS (Wert)	:	#ffc0cb	CSS (Wert)	:	#90ee90
CSS (kürzest)	:	#ffc0cb	CSS (kürzest)	:	#90ee90
CSS (RGB)	:	rgb(255,192,203)	CSS (RGB)	:	rgb(144,238,144)
CSS (%RGB)	:	rgb(100%,75%,79%)	CSS (%RGB)	:	rgb(56%,93%,56%)

Verlauf Hintergrundfarbwert #ffc0cb nach Schriftfarbwert #90ee90
#ffc0cb	#efc6c2	#dfcdba	#cfd3b1	#bfdaa9	#afe0a0	#9fe798	#90ee90
#ffc0cb	#efc6c2	#dfcdba	#cfd3b1	#bfdaa9	#afe0a0	#9fe798	#90ee90

Kombination von #ffc0cb und #90ee90
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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.				#90ee90 ist nicht als Schriftfarbe auf Hintergrund #ffc0cb geeignet, da die Helligkeit und Farben zu ähnlich sind. Die Ähnlichkeit von #90ee90 und #ffc0cb ergibt sich zu 94.83%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 5.17%.

Hintergrundfarbwert #ffc0cb				Schriftfarbwert #90ee90
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffc0cb	#ffc0cb	#ffc0cb	#ffc0cb	#90ee90	#90ee90	#90ee90	#90ee90
#ffc9d2	#ffc9d2	#daa4ae	#daa4ae	#9ff09f	#9ff09f	#7bcc7b	#7bcc7b
#ffd2d9	#ffd2d9	#b68991	#b68991	#aff2af	#aff2af	#66aa66	#66aa66
#ffdbe1	#ffdbe1	#916d74	#916d74	#bff5bf	#bff5bf	#528852	#528852
#ffe4e8	#ffe4e8	#6d5257	#6d5257	#cff7cf	#cff7cf	#3d663d	#3d663d
#ffedf0	#ffedf0	#48363a	#48363a	#dffadf	#dffadf	#294429	#294429
#fff6f7	#fff6f7	#241b1d	#241b1d	#effcef	#effcef	#142214	#142214
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ffc0cb und Farbwert #90ee90

Wechsel der Textfarbe bei Hover bei Tag label

Die Textfarbe soll sich von Farbwert #ffc0cb auf Farbwert #90ee90 ändern, wenn man mit der Maus auf <label> zeigt. Bereiten wir zunächst eine Darstellung von <label> in Farbwert #ffc0cb vor.

Wir legen z.B. bei <label> die Textfarbe auf Farbwert #ffc0cb fest und vergrößern die Größe der Schrift auf 123%:

<style type="text/css"><!--
  label { 
    color: #ffc0cb; 
    font-size: 123%;
  }
//-->
</style>

Nun stellen wir ein, dass sich bei Mausberührung die Textfarbe zu #90ee90 ändert.

<style type="text/css"><!--
  label:hover { 
    color:#90ee90;
  }
//-->
</style>

Mehr zum Thema label lesen Sie in Formulare in HTML. Die Beschreibung vom hier gezeigten Tag label erfahren Sie in der HTML Referenz unter <label>.

Wechsel der Umrandung bei Hover bei HTML-Tag p

Die Rahmenfarbe soll sich von Farbwert #ffc0cb auf Farbwert #90ee90 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Darstellung von <p> in Farbwert #ffc0cb vor.

In diesem Beispiel umranden wir <p> mit einem 1 Pixel dicken, gezahnten Rahmen in Farbwert #ffc0cb.

<style type="text/css"><!--
  p { 
    border-color: #ffc0cb; 
    border-width: 1px; 
    border-style: ridge;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Berührung mit der Maus die Rahmenfarbe zu #90ee90 ändert.

<style type="text/css"><!--
  p:hover { 
    border-color:#90ee90;
  }
//-->
</style>

Mehr zu p können Sie in Grundlegende Gestaltungselemente in HTML nachsehen. Möglichkeiten vom Tag p sind in der HTML Referenz unter <p> genau zusammengestellt.