Ressourcen: 120 HTML Farbnamen - Kombination von Farbe aquamarine und Farbe mintcream

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 aquamarine			Schriftfarbe mintcream
Detail	:	Hintergrund aquamarine	Detail	:	Schrift mintcream
Farbe	:	aquamarine	Farbe	:	mintcream
Farbwert	:	#7fffd4	Farbwert	:	#f5fffa
HTML	:	aquamarine	HTML	:	mintcream
HTML (Wert)	:	#7fffd4	HTML (Wert)	:	#f5fffa
CSS	:	aquamarine	CSS	:	mintcream
CSS (Wert)	:	#7fffd4	CSS (Wert)	:	#f5fffa
CSS (kürzest)	:	#7fffd4	CSS (kürzest)	:	#f5fffa
CSS (RGB)	:	rgb(127,255,212)	CSS (RGB)	:	rgb(245,255,250)
CSS (%RGB)	:	rgb(49%,100%,83%)	CSS (%RGB)	:	rgb(96%,100%,98%)

Verlauf Hintergrundfarbe aquamarine nach Schriftfarbe mintcream
#7fffd4	#8fffd9	#a0ffde	#b1ffe4	#c2ffe9	#d3ffef	#e4fff4	#f5fffa
#7fffd4	#8fffd9	#a0ffde	#b1ffe4	#c2ffe9	#d3ffef	#e4fff4	#f5fffa

Kombination von aquamarine und mintcream
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. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Cras id velit ante.				Die Ähnlichkeit von mintcream und aquamarine beträgt 94.29%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 5.71%. mintcream ist nicht als Schriftfarbe auf Hintergrund aquamarine geeignet, da sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbe aquamarine				Schriftfarbe mintcream
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#7fffd4	#7fffd4	#7fffd4	#7fffd4	#f5fffa	#f5fffa	#f5fffa	#f5fffa
#91ffda	#91ffda	#6cdab5	#6cdab5	#f6fffa	#f6fffa	#d2dad6	#d2dad6
#a3ffe0	#a3ffe0	#5ab697	#5ab697	#f7fffb	#f7fffb	#afb6b2	#afb6b2
#b5ffe6	#b5ffe6	#489179	#489179	#f9fffc	#f9fffc	#8c918e	#8c918e
#c8ffec	#c8ffec	#366d5a	#366d5a	#fafffc	#fafffc	#696d6b	#696d6b
#dafff2	#dafff2	#24483c	#24483c	#fcfffd	#fcfffd	#464847	#464847
#ecfff8	#ecfff8	#12241e	#12241e	#fdfffe	#fdfffe	#232423	#232423
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe aquamarine und Farbe mintcream

Wechsel der Textfarbe bei Hover mit Tag h1

Eine Überschrift der 1. Stufe setzt man mit Tag <h1>. Diese können Sie farblich gestalten und hervorheben.

Die Textfarbe soll sich von Farbe aquamarine auf Farbe mintcream ändern, wenn man mit der Maus auf <h1> zeigt. Bereiten wir zunächst die Darstellung von <h1> in Farbe aquamarine vor.

Wir legen zum Beispiel bei <h1> die Textfarbe auf Farbe aquamarine fest. Die Hintergrundfarbe lassen wir unverändert. Die Schriftart ändern wir auf sans-serif:

<style type="text/css"><!--
  h1 { 
    font-family:sans-serif; 
    color:aquamarine;
  }
//-->
</style>

Jetzt stellen wir ein, dass bei Mausberührung die Textfarbe auf mintcream geändert wird.

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

Mehr zum Thema h1 können Sie in Grundlegende Gestaltungselemente in HTML nachsehen. Der HTML-Tag h1 ist in der HTML Referenz unter <h1> genau zusammengestellt.

Wechsel der Hintergrundfarbe bei Hover von Befehl h5

Eine Überschrift setzen Sie mit HTML-Tag <h5>. Diese kann man farblich gestalten und hervorheben.

Die Hintergrundfarbe soll sich von Farbe aquamarine auf Farbe mintcream ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <h5> in Farbe aquamarine vor.

Für dieses Beispiel ändern wir bei <h5> die Hintergrundfarbe auf Farbe aquamarine. Zwar lassen wir die Textfarbe unverändert, ändern jedoch die Schriftart auf arial und setzen die Schriftgröße auf 82%.

<style type="text/css"><!--
  h5 { 
    font-size:82%; 
    background-color:aquamarine; 
    font-family:arial;
  }
//-->
</style>

Jetzt stellen wir ein, dass sich bei Hover die Hintergrundfarbe zu mintcream ändert.

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

Weiteres zu h5 können Sie in Grundlegende Gestaltungselemente in HTML erfahren. Mehr zum hier genutzten Tag <h5>.