Ressourcen: 137 HTML Farbnamen - Kombination von Farbe lightblue und Farbe thistle

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.

Hintergrundfarbe lightblue			Schriftfarbe thistle
Detail	:	Hintergrund lightblue	Detail	:	Schrift thistle
Farbe	:	lightblue	Farbe	:	thistle
Farbwert	:	#add8e6	Farbwert	:	#d8bfd8
HTML	:	lightblue	HTML	:	thistle
HTML (Wert)	:	#add8e6	HTML (Wert)	:	#d8bfd8
CSS	:	lightblue	CSS	:	thistle
CSS (Wert)	:	#add8e6	CSS (Wert)	:	#d8bfd8
CSS (kürzest)	:	#add8e6	CSS (kürzest)	:	#d8bfd8
CSS (RGB)	:	rgb(173,216,230)	CSS (RGB)	:	rgb(216,191,216)
CSS (%RGB)	:	rgb(67%,84%,90%)	CSS (%RGB)	:	rgb(84%,74%,84%)

Verlauf Hintergrundfarbe lightblue nach Schriftfarbe thistle
#add8e6	#b3d4e4	#b9d0e2	#bfcde0	#c5c9de	#cbc6dc	#d1c2da	#d8bfd8
#add8e6	#b3d4e4	#b9d0e2	#bfcde0	#c5c9de	#cbc6dc	#d1c2da	#d8bfd8

Kombination von lightblue und thistle
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna.				thistle eignet sich nicht als Schriftfarbe auf Hintergrund lightblue. Weder der Helligkeitsunterschied noch der Farbunterschied sind ausreichend. Die Ähnlichkeit der Farben thistle und lightblue beträgt 94.71%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 5.29%.

Hintergrundfarbe lightblue				Schriftfarbe thistle
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#add8e6	#add8e6	#add8e6	#add8e6	#d8bfd8	#d8bfd8	#d8bfd8	#d8bfd8
#b8dde9	#b8dde9	#94b9c5	#94b9c5	#ddc8dd	#ddc8dd	#b9a3b9	#b9a3b9
#c4e3ed	#c4e3ed	#7b9aa4	#7b9aa4	#e3d1e3	#e3d1e3	#9a889a	#9a889a
#d0e8f0	#d0e8f0	#627b83	#627b83	#e8dae8	#e8dae8	#7b6d7b	#7b6d7b
#dbeef4	#dbeef4	#4a5c62	#4a5c62	#eee3ee	#eee3ee	#5c515c	#5c515c
#e7f3f7	#e7f3f7	#313d41	#313d41	#f3ecf3	#f3ecf3	#3d363d	#3d363d
#f3f9fb	#f3f9fb	#181e20	#181e20	#f9f5f9	#f9f5f9	#1e1b1e	#1e1b1e
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiel zur Kombination von Farbe lightblue und Farbe thistle

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag kbd

Die Hintergrundfarbe soll sich von Farbe lightblue auf Farbe thistle ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <kbd> in Farbe lightblue vor.

Wir ändern hier die Hintergrundfarbe von <kbd> auf Farbe lightblue. Die Textfarbe verändern wir nicht, setzen jedoch die Schriftart auf verdana und verkleinern die Schriftgröße auf 87%.

<style type="text/css"><!--
  kbd { 
    font-size:87%; 
    background-color:lightblue; 
    font-family:verdana;
  }
//-->
</style>

Nun fordern wir, dass sich bei Mausberührung die Hintergrundfarbe zu thistle ändert.

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

Weiteres zum Thema kbd können Sie in Text in HTML lesen. Mehr zum hier gezeigten HTML-Tag kbd finden Sie in der HTML Referenz unter <kbd>.