Ressourcen: 120 HTML Farbnamen - Kombination von Farbe orange und Farbe seagreen

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 orange			Schriftfarbe seagreen
Detail	:	Hintergrund orange	Detail	:	Schrift seagreen
Farbe	:	orange	Farbe	:	seagreen
Farbwert	:	#ffa500	Farbwert	:	#2e8b57
HTML	:	orange	HTML	:	seagreen
HTML (Wert)	:	#ffa500	HTML (Wert)	:	#2e8b57
CSS	:	orange	CSS	:	seagreen
CSS (Wert)	:	#ffa500	CSS (Wert)	:	#2e8b57
CSS (kürzest)	:	#ffa500	CSS (kürzest)	:	#2e8b57
CSS (RGB)	:	rgb(255,165,0)	CSS (RGB)	:	rgb(46,139,87)
CSS (%RGB)	:	rgb(100%,64%,0%)	CSS (%RGB)	:	rgb(18%,54%,34%)

Verlauf Hintergrundfarbe orange nach Schriftfarbe seagreen
#ffa500	#e1a10c	#c39d18	#a59925	#879631	#69923e	#4b8e4a	#2e8b57
#ffa500	#e1a10c	#c39d18	#a59925	#879631	#69923e	#4b8e4a	#2e8b57

Kombination von orange und seagreen
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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. Cras id velit ante.				Die Ähnlichkeit der Farben seagreen und orange ergibt sich zu 89.76%. Die Lesbarkeit dieser Kombination bewerte ich mit 10.24%. Auf Hintergrund orange ist seagreen ungeeignet. Die Unterschiede in der Helligkeit und Farbe sind unzureichend.

Hintergrundfarbe orange				Schriftfarbe seagreen
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffa500	#ffa500	#ffa500	#ffa500	#2e8b57	#2e8b57	#2e8b57	#2e8b57
#ffb124	#ffb124	#da8d00	#da8d00	#4b9b6f	#4b9b6f	#27774a	#27774a
#ffbe48	#ffbe48	#b67500	#b67500	#69ac87	#69ac87	#20633e	#20633e
#ffcb6d	#ffcb6d	#915e00	#915e00	#87bc9f	#87bc9f	#1a4f31	#1a4f31
#ffd891	#ffd891	#6d4600	#6d4600	#a5cdb7	#a5cdb7	#133b25	#133b25
#ffe5b6	#ffe5b6	#482f00	#482f00	#c3ddcf	#c3ddcf	#0d2718	#0d2718
#fff2da	#fff2da	#241700	#241700	#e1eee7	#e1eee7	#06130c	#06130c
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbe orange und Farbe seagreen

Wechsel der Textfarbe bei Hover von HTML-Befehl span

Die Textfarbe soll sich von Farbe orange auf Farbe seagreen ändern, wenn man mit der Maus auf <span> zeigt. Wir bereiten zunächst die Darstellung von <span> in Farbe orange vor.

Für dieses Beispiel legen wir Farbe orange als Textfarbe von <span> fest. Die Hintergrundfarbe behalten wir bei. Die Schriftart setzen wir auf courier new und ändern die Größe der Schrift auf 12px:

<style type="text/css"><!--
  span { 
    color: orange; 
    font-family: courier new; 
    font-size: 12px;
  }
//-->
</style>

Nun fordern wir, dass bei Hover die Textfarbe auf seagreen gesetzt wird.

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

Möglichkeiten vom hier genutzten Befehl span sind in der HTML Referenz bei <span> genau beschrieben.

Text- und Unterstreichungsfarben bei HTML-Tag cite

Wir ändern für dieses Beispiel die Textfarbe von <cite> auf Farbe seagreen. Die Schriftart setzen wir auf monospace und setzen die Schriftgröße auf 114%. Wir unterstreichen den Inhalt von <cite> mit Hilfe eines gestrichelten Rahmens mit 2 Pixel Dicke in Farbe orange. Das geht mit HTML nicht. Wir verwenden daher CSS.

<style type="text/css"><!--
  cite { 
    font-family: monospace; 
    color: seagreen; 
    font-size: 114%; 
    border-bottom: 2px dashed orange;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben.

Einzelheiten vom HTML-Tag cite sind in der HTML Referenz unter <cite> zusammengestellt.