Ressourcen: 120 HTML Farbnamen - Kombination von Farbe hotpink und Farbwert #b22222

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 hotpink			Schriftfarbwert #b22222
Detail	:	Hintergrund hotpink	Detail	:	Schrift #b22222
Farbe	:	hotpink	Farbwert	:	#b22222
Farbwert	:	#ff69b4	Farbe	:	firebrick
HTML	:	hotpink	HTML	:	#b22222
HTML (Wert)	:	#ff69b4	HTML (Wert)	:	#b22222
CSS	:	hotpink	CSS	:	#b22222
CSS (Wert)	:	#ff69b4	CSS (Wert)	:	#b22222
CSS (kürzest)	:	#ff69b4	CSS (kürzest)	:	#b22222
CSS (RGB)	:	rgb(255,105,180)	CSS (RGB)	:	rgb(178,34,34)
CSS (%RGB)	:	rgb(100%,41%,70%)	CSS (%RGB)	:	rgb(69%,13%,13%)

Verlauf Hintergrundfarbe hotpink nach Schriftfarbwert #b22222
#ff69b4	#f45e9f	#e9548a	#de4a75	#d34060	#c8364b	#bd2c36	#b22222
#ff69b4	#f45e9f	#e9548a	#de4a75	#d34060	#c8364b	#bd2c36	#b22222

Kombination von hotpink und #b22222
Cras vestibulum tristique erat, ac interdum justo cursus in. 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 id velit ante. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.				#b22222 ist nicht als Schriftfarbe auf Hintergrund hotpink geeignet. Die Unterschiede in der Helligkeit und Farbe sind nicht ausreichend. Die Ähnlichkeit der Farben #b22222 und hotpink beträgt 87.99%. Die Lesbarkeit dieser Kombination ergibt sich zu 12.01%.

Hintergrundfarbe hotpink				Schriftfarbwert #b22222
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ff69b4	#ff69b4	#ff69b4	#ff69b4	#b22222	#b22222	#b22222	#b22222
#ff7ebe	#ff7ebe	#da5a9a	#da5a9a	#bd4141	#bd4141	#981d1d	#981d1d
#ff93c9	#ff93c9	#b64b80	#b64b80	#c86161	#c86161	#7f1818	#7f1818
#ffa9d4	#ffa9d4	#913c66	#913c66	#d38080	#d38080	#651313	#651313
#ffbede	#ffbede	#6d2d4d	#6d2d4d	#dea0a0	#dea0a0	#4c0e0e	#4c0e0e
#ffd4e9	#ffd4e9	#481e33	#481e33	#e9bfbf	#e9bfbf	#320909	#320909
#ffe9f4	#ffe9f4	#240f19	#240f19	#f4dfdf	#f4dfdf	#190404	#190404
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiel zur Kombination von Farbe hotpink und Farbwert #b22222

Wechsel der Hintergrundfarbe bei Hover von Befehl h3

Mit Tag <h3> wird eine Überschrift erzeugt. Diese kann hervorgehoben und farblich gestaltet werden.

Die Hintergrundfarbe soll sich von Farbe hotpink auf Farbwert #b22222 ändern, wenn man mit der Maus auf <h3> zeigt. Bereiten wir zunächst die Darstellung von <h3> in Farbe hotpink vor.

Wir legen als Beispiel Farbe hotpink als Hintergrundfarbe von <h3> fest. Die Textfarbe ändern wir nicht. Die Schriftart ändern wir auf monospace und setzen die Größe der Schrift auf 122%.

<style type="text/css"><!--
  h3 { 
    background-color: hotpink; 
    font-size: 122%; 
    font-family: monospace;
  }
//-->
</style>

Nun stellen wir ein, dass bei Berührung mit der Maus die Hintergrundfarbe auf #b22222 geändert wird.

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

Weiteres zum Thema h3 können Sie in Grundlegende Gestaltungselemente in HTML finden. Weiteres zum hier verwendeten HTML-Befehl h3 finden Sie in der HTML Referenz unter <h3>.