Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #f5deb3 und Farbe lightcyan

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 #f5deb3			Schriftfarbe lightcyan
Detail	:	Hintergrund #f5deb3	Detail	:	Schrift lightcyan
Farbwert	:	#f5deb3	Farbe	:	lightcyan
Farbe	:	wheat	Farbwert	:	#e0ffff
HTML	:	#f5deb3	HTML	:	lightcyan
HTML (Wert)	:	#f5deb3	HTML (Wert)	:	#e0ffff
CSS	:	#f5deb3	CSS	:	lightcyan
CSS (Wert)	:	#f5deb3	CSS (Wert)	:	#e0ffff
CSS (kürzest)	:	#f5deb3	CSS (kürzest)	:	#e0ffff
CSS (RGB)	:	rgb(245,222,179)	CSS (RGB)	:	rgb(224,255,255)
CSS (%RGB)	:	rgb(96%,87%,70%)	CSS (%RGB)	:	rgb(87%,100%,100%)

Verlauf Hintergrundfarbwert #f5deb3 nach Schriftfarbe lightcyan
#f5deb3	#f2e2bd	#efe7c8	#ececd3	#e9f0de	#e6f5e9	#e3faf4	#e0ffff
#f5deb3	#f2e2bd	#efe7c8	#ececd3	#e9f0de	#e6f5e9	#e3faf4	#e0ffff

Kombination von #f5deb3 und lightcyan
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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				Die Ähnlichkeit der Farben lightcyan und #f5deb3 ergibt sich zu 94.07%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 5.93%. lightcyan ist nicht als Schriftfarbe auf Hintergrund #f5deb3 geeignet. Die Helligkeit und Farben sind sich zu ähnlich.

Hintergrundfarbwert #f5deb3				Schriftfarbe lightcyan
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#f5deb3	#f5deb3	#f5deb3	#f5deb3	#e0ffff	#e0ffff	#e0ffff	#e0ffff
#f6e2bd	#f6e2bd	#d2be99	#d2be99	#e4ffff	#e4ffff	#c0dada	#c0dada
#f7e7c8	#f7e7c8	#af9e7f	#af9e7f	#e8ffff	#e8ffff	#a0b6b6	#a0b6b6
#f9ecd3	#f9ecd3	#8c7e66	#8c7e66	#edffff	#edffff	#809191	#809191
#faf0de	#faf0de	#695f4c	#695f4c	#f1ffff	#f1ffff	#606d6d	#606d6d
#fcf5e9	#fcf5e9	#463f33	#463f33	#f6ffff	#f6ffff	#404848	#404848
#fdfaf4	#fdfaf4	#231f19	#231f19	#faffff	#faffff	#202424	#202424
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #f5deb3 und Farbe lightcyan

Wechsel der Unterstreichung bei Hover von Tag h6

Mit Tag <h6> wird eine Überschrift gesetzt. Diese können Sie farblich gestalten und hervorheben.

Die Farbe der Unterstreichung soll sich von Farbwert #f5deb3 auf Farbe lightcyan ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <h6> in Farbwert #f5deb3 vor.

In diesem Beispiel unterstreichen wir <h6> mit Hilfe eines gefurchten Rahmens mit 2 Pixel Dicke in Farbwert #f5deb3.

<style type="text/css"><!--
  h6 { border-bottom:2px groove #f5deb3; }
//-->
</style>

Nun fordern wir, dass sich bei Hover die Unterstreichungsfarbe zu lightcyan ändert.

<style type="text/css"><!--
  h6: hover { 
    border-bottom-color: lightcyan;
  }
//-->
</style>

Die Idee ist dabei, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu verwenden. Manchmal sieht man dies bei Verweisen. Der Text wird in einer Farbe dargestellt. Und die Unterstreichung in einer anderen. Hierbei handelt es sich jedoch nicht um eine "normale" Unterstreichung, der Text selbst ist nicht unterstrichen. Die Unterstreichung wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Mehr zu h6 lesen Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten des hier gezeigten HTML-Tag <h6>.

Wechsel der Textfarbe bei Hover bei Tag pre

Die Textfarbe soll sich von Farbwert #f5deb3 auf Farbe lightcyan ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <pre> in Farbwert #f5deb3 vor.

Wir legen in diesem Beispiel Farbwert #f5deb3 als Textfarbe von <pre> fest. Zwar behalten wir die Hintergrundfarbe bei, ändern jedoch die Schriftart auf sans-serif und setzen die Größe der Schrift auf 9px:

<style type="text/css"><!--
  pre { 
    font-family:sans-serif; 
    color:#f5deb3; 
    font-size:9px;
  }
//-->
</style>

Jetzt fordern wir, dass bei Berührung mit der Maus die Textfarbe auf lightcyan gesetzt wird.

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

Mehr zum Thema können Sie in Blockorientierte Elemente in HTML lesen. Möglichkeiten des HTML-Befehl <pre>.