Ressourcen: 17 HTML Standard Farbnamen - Kombination von Farbe maroon und Farbwert #00ff00

von Thomas Salvador.

Farben werden in HTML entweder mit ihrem Namen oder mit ihrem Wert beschrieben.

HTML verfügt seit jeher über 17 Standard Farbnamen.

Sie entstehen dadurch, dass die 8 Grundfarben jeweils maximal und zu 50% enthalten sind.

Zu diesen 16 Farben kommt mit grey eine alternative Schreibweise für gray.

Hintergrundfarbe maroon

Schriftfarbwert #00ff00

DetailHintergrund maroon DetailSchrift #00ff00 
Farbe :maroonFarbwert :#00ff00
Farbwert :#800000Farbe :lime
HTML:maroonHTML:#00ff00
HTML (Wert):#800000HTML (Wert):#00ff00
CSS:maroonCSS:#00ff00
CSS (Wert):#800000CSS (Wert):#00ff00
CSS (kürzest):#800000CSS (kürzest):#0f0
CSS (RGB):rgb(128,0,0)CSS (RGB):rgb(0,255,0)
CSS (%RGB):rgb(50%,0%,0%)CSS (%RGB):rgb(0%,100%,0%)

Verlauf Hintergrundfarbe maroon nach Schriftfarbwert #00ff00

#800000#6d2400#5b4800#496d00#369100#24b600#12da00#00ff00
#800000#6d2400#5b4800#496d00#369100#24b600#12da00#00ff00

Kombination von maroon und #00ff00

Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante.

Auf Hintergrund maroon ist #00ff00 ungeeignet. Die Unterschiede in der Helligkeit und Farbe sind zu gering.

Die Ähnlichkeit von #00ff00 und maroon beträgt 62.00%. Die Lesbarkeit dieser Kombination ergibt sich zu 38.00%.

Hintergrundfarbe maroon

Schriftfarbwert #00ff00

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#800000#800000#800000#800000#00ff00#00ff00#00ff00#00ff00
#922424#922424#6d0000#6d0000#24ff24#24ff24#00da00#00da00
#a44848#a44848#5b0000#5b0000#48ff48#48ff48#00b600#00b600
#b66d6d#b66d6d#490000#490000#6dff6d#6dff6d#009100#009100
#c89191#c89191#360000#360000#91ff91#91ff91#006d00#006d00
#dab6b6#dab6b6#240000#240000#b6ffb6#b6ffb6#004800#004800
#ecdada#ecdada#120000#120000#daffda#daffda#002400#002400
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe maroon und Farbwert #00ff00

Zebra-Effekt bei Tag th

Man spricht vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe verwendet werden. Der Effekt unterstützt das Auge dabei, die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ger und .ung für <th> mit unterschiedlichen Hintergrundfarben Farbe maroon und Farbwert #00ff00.

<style type="text/css"><!--
  th.ger { 
    background-color: maroon;
  }
  th.ung { 
    background-color:#0f0;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd genutzt.

<table>
<tr><td class="ger">Va/a</td><td class="ung">Vb/a</td><td class="ger">Vc/a</td></tr>
<tr><td class="ger">Va/b</td><td class="ung">Vb/b</td><td class="ger">Vc/b</td></tr>
<tr><td class="ger">Va/c</td><td class="ung">Vb/c</td><td class="ger">Vc/c</td></tr>
</table>

Mehr zu th können Sie in Tabellen in HTML finden. Mehr zum hier verwendeten Befehl th erfahren Sie in der HTML Referenz unter <th>.

Wechsel der Umrandung bei Hover bei Befehl blockquote

Die Rahmenfarbe soll sich von Farbe maroon auf Farbwert #00ff00 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <blockquote> in Farbe maroon vor.

In diesem Beispiel umranden wir <blockquote> mit einem 5 Pixel dicken, gestrichelten Rahmen in Farbe maroon.

<style type="text/css"><!--
  blockquote { 
    border-style:dashed; 
    border-width:5px; 
    border-color:maroon;
  }
//-->
</style>
Jetzt stellen wir ein, dass bei Berührung mit der Maus die Rahmenfarbe auf #00ff00 geändert wird.
<style type="text/css"><!--
  blockquote:hover { 
    border-color:#00ff00;
  }
//-->
</style>

Weiteres zu blockquote finden Sie in Blockorientierte Elemente in HTML. Weiteres zum hier genutzten Tag <blockquote>.

Tabelle der 17 HTML Farbnamen

Hintergrund Farbwert Farbe undSchrift Farbwert Farbkombination
aqua #00ffff         +  aqua #00ffff aqua / maroon
black #000000         +  black #000000 black / maroon
blue #0000ff         +  blue #0000ff blue / maroon
fuchsia #ff00ff         +  fuchsia #ff00ff fuchsia / maroon
gray #808080         +  gray #808080 gray / maroon
grey #808080         +  grey #808080 grey / maroon
green #008000         +  green #008000 green / maroon
lime #00ff00         +  lime #00ff00 lime / maroon
maroon #800000         +  maroon #800000 maroon / maroon
navy #000080         +  navy #000080 navy / maroon
olive #808000         +  olive #808000 olive / maroon
purple #800080         +  purple #800080 purple / maroon
red #ff0000         +  red #ff0000 red / maroon
silver #c0c0c0         +  silver #c0c0c0 silver / maroon
teal #008080         +  teal #008080 teal / maroon
white #ffffff         +  white #ffffff white / maroon
yellow #ffff00         +  yellow #ffff00 yellow / maroon

Weitere Farbtabellen