Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #87ceeb und Farbwert #40e0d0

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 #87ceeb			Schriftfarbwert #40e0d0
Detail	:	Hintergrund #87ceeb	Detail	:	Schrift #40e0d0
Farbwert	:	#87ceeb	Farbwert	:	#40e0d0
Farbe	:	skyblue	Farbe	:	turquoise
HTML	:	#87ceeb	HTML	:	#40e0d0
HTML (Wert)	:	#87ceeb	HTML (Wert)	:	#40e0d0
CSS	:	#87ceeb	CSS	:	#40e0d0
CSS (Wert)	:	#87ceeb	CSS (Wert)	:	#40e0d0
CSS (kürzest)	:	#87ceeb	CSS (kürzest)	:	#40e0d0
CSS (RGB)	:	rgb(135,206,235)	CSS (RGB)	:	rgb(64,224,208)
CSS (%RGB)	:	rgb(52%,80%,92%)	CSS (%RGB)	:	rgb(25%,87%,81%)

Verlauf Hintergrundfarbwert #87ceeb nach Schriftfarbwert #40e0d0
#87ceeb	#7cd0e7	#72d3e3	#68d5df	#5ed8db	#54dad7	#4addd3	#40e0d0
#87ceeb	#7cd0e7	#72d3e3	#68d5df	#5ed8db	#54dad7	#4addd3	#40e0d0

Kombination von #87ceeb und #40e0d0
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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante.				Auf Hintergrund #87ceeb ist #40e0d0 ungeeignet. Die Helligkeit und Farben sind sich zu ähnlich. Die Ähnlichkeit der Farben #40e0d0 und #87ceeb ergibt sich zu 94.95%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 5.05%.

Hintergrundfarbwert #87ceeb				Schriftfarbwert #40e0d0
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#87ceeb	#87ceeb	#87ceeb	#87ceeb	#40e0d0	#40e0d0	#40e0d0	#40e0d0
#98d5ed	#98d5ed	#73b0c9	#73b0c9	#5be4d6	#5be4d6	#36c0b2	#36c0b2
#a9dcf0	#a9dcf0	#6093a7	#6093a7	#76e8dd	#76e8dd	#2da094	#2da094
#bae3f3	#bae3f3	#4d7586	#4d7586	#91ede4	#91ede4	#248076	#248076
#cbeaf6	#cbeaf6	#395864	#395864	#adf1ea	#adf1ea	#1b6059	#1b6059
#dcf1f9	#dcf1f9	#263a43	#263a43	#c8f6f1	#c8f6f1	#12403b	#12403b
#edf8fc	#edf8fc	#131d21	#131d21	#e3faf8	#e3faf8	#09201d	#09201d
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #87ceeb und Farbwert #40e0d0

Wechsel der Umrandung bei Hover von HTML-Befehl p

Die Rahmenfarbe soll sich von Farbwert #87ceeb auf Farbwert #40e0d0 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <p> in Farbwert #87ceeb vor.

In diesem Beispiel umranden wir <p> mit einem 4 Pixel dicken, gefurchten Rahmen in Farbwert #87ceeb.

<style type="text/css"><!--
  p { 
    border-color:#87ceeb; 
    border-width:4px; 
    border-style:groove;
  }
//-->
</style>

Nun fordern wir, dass sich bei Berührung mit der Maus die Rahmenfarbe auf #40e0d0 ändert.

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

Mehr zum Thema p können Sie in Grundlegende Gestaltungselemente in HTML nachsehen. Einzelheiten vom Tag p sind in der HTML Referenz bei <p> zusammengestellt.

Hintergrund/Text-Kombination mit Tag pre

Hier ändern wir die Textfarbe von <pre> auf Farbwert #40e0d0 und die Hintergrundfarbe von <pre> auf Farbwert #87ceeb. Als Schriftart wählen wir arial und erhöhen die Schriftgröße auf 110%.

<style type="text/css"><!--
  pre { 
    color:#40e0d0; 
    font-family:arial; 
    background-color:#87ceeb; 
    font-size:110%;
  }
//-->
</style>

Weiteres zum Thema pre finden Sie in Blockorientierte Elemente in HTML. Weiteres zum Tag <pre>.