Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #adff2f und Farbwert #87cefa

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 #adff2f			Schriftfarbwert #87cefa
Detail	:	Hintergrund #adff2f	Detail	:	Schrift #87cefa
Farbwert	:	#adff2f	Farbwert	:	#87cefa
Farbe	:	greenyellow	Farbe	:	lightskyblue
HTML	:	#adff2f	HTML	:	#87cefa
HTML (Wert)	:	#adff2f	HTML (Wert)	:	#87cefa
CSS	:	#adff2f	CSS	:	#87cefa
CSS (Wert)	:	#adff2f	CSS (Wert)	:	#87cefa
CSS (kürzest)	:	#adff2f	CSS (kürzest)	:	#87cefa
CSS (RGB)	:	rgb(173,255,47)	CSS (RGB)	:	rgb(135,206,250)
CSS (%RGB)	:	rgb(67%,100%,18%)	CSS (%RGB)	:	rgb(52%,80%,98%)

Verlauf Hintergrundfarbwert #adff2f nach Schriftfarbwert #87cefa
#adff2f	#a7f84c	#a2f169	#9cea86	#97e3a3	#91dcc0	#8cd5dd	#87cefa
#adff2f	#a7f84c	#a2f169	#9cea86	#97e3a3	#91dcc0	#8cd5dd	#87cefa

Kombination von #adff2f und #87cefa
Cras id velit ante. 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 vestibulum tristique erat, ac interdum justo cursus in. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit der Farben #87cefa und #adff2f beträgt 93.34%. Die Lesbarkeit dieser Kombination ergibt sich zu 6.66%. #87cefa ist nicht als Schriftfarbe auf Hintergrund #adff2f geeignet. Weder der Helligkeitsunterschied noch der Farbunterschied sind gross genug.

Hintergrundfarbwert #adff2f				Schriftfarbwert #87cefa
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#adff2f	#adff2f	#adff2f	#adff2f	#87cefa	#87cefa	#87cefa	#87cefa
#b8ff4c	#b8ff4c	#94da28	#94da28	#98d5fa	#98d5fa	#73b0d6	#73b0d6
#c4ff6a	#c4ff6a	#7bb621	#7bb621	#a9dcfb	#a9dcfb	#6093b2	#6093b2
#d0ff88	#d0ff88	#62911a	#62911a	#bae3fc	#bae3fc	#4d758e	#4d758e
#dbffa5	#dbffa5	#4a6d14	#4a6d14	#cbeafc	#cbeafc	#39586b	#39586b
#e7ffc3	#e7ffc3	#31480d	#31480d	#dcf1fd	#dcf1fd	#263a47	#263a47
#f3ffe1	#f3ffe1	#182406	#182406	#edf8fe	#edf8fe	#131d23	#131d23
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #adff2f und Farbwert #87cefa

Wechsel der Hintergrundfarbe bei Hover mit HTML-Tag h3

Mit Tag <h3> setzen Sie eine Überschrift. Diese können Sie farblich gestalten.

Die Hintergrundfarbe soll sich von Farbwert #adff2f auf Farbwert #87cefa ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <h3> in Farbwert #adff2f vor.

Wir ändern zum Beispiel die Hintergrundfarbe von <h3> auf Farbwert #adff2f. Die Textfarbe behalten wir bei. Die Schriftart ändern wir auf arial. Die Größe der Schrift setzen wir auf 9px:

<style type="text/css"><!--
  h3 { 
    font-size:9px; 
    background-color:#adff2f; 
    font-family:arial;
  }
//-->
</style>

Nun stellen wir ein, dass bei Berührung mit der Maus die Hintergrundfarbe auf #87cefa gesetzt wird.

<style type="text/css"><!--
  h3:hover { 
    background-color:#87cefa;
  }
//-->
</style>

Weiteres zu h3 können Sie in Grundlegende Gestaltungselemente in HTML lesen. Mehr zum hier verwendeten Befehl h3 erfahren Sie in der HTML Referenz unter <h3>.

Füllen und Umranden bei Befehl h2

Mit HTML-Tag <h2> erzeugen Sie eine Überschrift. Diese kann man hervorheben und farblich gestalten.

Hier umranden wir <h2> mit einem herausstehenden, 3 Punkte dicken Rahmen in Farbwert #87cefa . Die Hintergrundfarbe für <h2> setzen wir entsprechend auf Farbwert #adff2f. In HTML geht das nicht. Wir verwenden deshalb CSS.

<style type="text/css"><!--
  h2 { 
    border-color:#87cefa; 
    background-color:#adff2f; 
    border-style:outset; 
    border-width:3pt;
  }
//-->
</style>

Weiteres zum Thema h2 können Sie in Grundlegende Gestaltungselemente in HTML erfahren. Die Beschreibung des Tag h2 erfahren Sie in der HTML Referenz unter <h2>.