Ressourcen: 120 HTML Farbnamen - Kombination von Farbe darkblue und Farbe lightblue

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.

Hintergrundfarbe darkblue			Schriftfarbe lightblue
Detail	:	Hintergrund darkblue	Detail	:	Schrift lightblue
Farbe	:	darkblue	Farbe	:	lightblue
Farbwert	:	#00008b	Farbwert	:	#add8e6
HTML	:	darkblue	HTML	:	lightblue
HTML (Wert)	:	#00008b	HTML (Wert)	:	#add8e6
CSS	:	darkblue	CSS	:	lightblue
CSS (Wert)	:	#00008b	CSS (Wert)	:	#add8e6
CSS (kürzest)	:	#00008b	CSS (kürzest)	:	#add8e6
CSS (RGB)	:	rgb(0,0,139)	CSS (RGB)	:	rgb(173,216,230)
CSS (%RGB)	:	rgb(0%,0%,54%)	CSS (%RGB)	:	rgb(67%,84%,90%)

Verlauf Hintergrundfarbe darkblue nach Schriftfarbe lightblue
#00008b	#181e98	#313da5	#4a5cb2	#627bbf	#7b9acc	#94b9d9	#add8e6
#00008b	#181e98	#313da5	#4a5cb2	#627bbf	#7b9acc	#94b9d9	#add8e6

Kombination von darkblue und lightblue
Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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.				Auf Hintergrund darkblue ist lightblue ungeeignet. Zwar ist der Helligkeitsunterschied in Ordnung, doch die Farben selbst sind zu ähnlich. Die Ähnlichkeit der Farben lightblue und darkblue beträgt 52.33%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 47.67%.

Hintergrundfarbe darkblue				Schriftfarbe lightblue
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#00008b	#00008b	#00008b	#00008b	#add8e6	#add8e6	#add8e6	#add8e6
#24249b	#24249b	#000077	#000077	#b8dde9	#b8dde9	#94b9c5	#94b9c5
#4848ac	#4848ac	#000063	#000063	#c4e3ed	#c4e3ed	#7b9aa4	#7b9aa4
#6d6dbc	#6d6dbc	#00004f	#00004f	#d0e8f0	#d0e8f0	#627b83	#627b83
#9191cd	#9191cd	#00003b	#00003b	#dbeef4	#dbeef4	#4a5c62	#4a5c62
#b6b6dd	#b6b6dd	#000027	#000027	#e7f3f7	#e7f3f7	#313d41	#313d41
#dadaee	#dadaee	#000013	#000013	#f3f9fb	#f3f9fb	#181e20	#181e20
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiel zur Kombination von Farbe darkblue und Farbe lightblue

Wechsel der Umrandung bei Hover mit Befehl h1

Eine Überschrift wird mit Befehl <h1> erzeugt und kann farblich gestaltet werden.

Die Rahmenfarbe soll sich von Farbe darkblue auf Farbe lightblue ändern, wenn man mit der Maus auf <h1> zeigt. Wir bereiten zunächst eine Formatierung von <h1> in Farbe darkblue vor.

In diesem Beispiel umranden wir <h1> mit einem 3 Pixel dicken, herausstehenden Rahmen in Farbe darkblue.

<style type="text/css"><!--
  h1 { 
    border-color: darkblue; 
    border-style: outset; 
    border-width: 3px;
  }
//-->
</style>

Nun stellen wir ein, dass bei Hover die Rahmenfarbe auf lightblue geändert wird.

<style type="text/css"><!--
  h1: hover { 
    border-color: lightblue;
  }
//-->
</style>

Weiteres zum Thema h1 können Sie in Grundlegende Gestaltungselemente in HTML finden. Der Tag h1 ist in der HTML Referenz bei <h1> genau gezeigt.