Ressourcen: 17 HTML Standard Farbnamen - Kombination von Farbwert #ff00ff und Farbwert #008000

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.

Hintergrundfarbwert #ff00ff

Schriftfarbwert #008000

DetailHintergrund #ff00ff DetailSchrift #008000 
Farbwert :#ff00ffFarbwert :#008000
Farbe :fuchsiaFarbe :green
HTML:#ff00ffHTML:#008000
HTML (Wert):#ff00ffHTML (Wert):#008000
CSS:#ff00ffCSS:#008000
CSS (Wert):#ff00ffCSS (Wert):#008000
CSS (kürzest):#f0fCSS (kürzest):#008000
CSS (RGB):rgb(255,0,255)CSS (RGB):rgb(0,128,0)
CSS (%RGB):rgb(100%,0%,100%)CSS (%RGB):rgb(0%,50%,0%)

Verlauf Hintergrundfarbwert #ff00ff nach Schriftfarbwert #008000

#ff00ff#da12da#b624b6#913691#6d496d#485b48#246d24#008000
#ff00ff#da12da#b624b6#913691#6d496d#485b48#246d24#008000

Kombination von #ff00ff und #008000

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

Die Ähnlichkeit der Farben #008000 und #ff00ff beträgt 92.20%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 7.80%.

#008000 ist nicht als Schriftfarbe auf Hintergrund #ff00ff geeignet. Zwar ist der Farbunterschied gut, der Helligkeitsunterschied ist jedoch zu gering.

Hintergrundfarbwert #ff00ff

Schriftfarbwert #008000

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#ff00ff#ff00ff#ff00ff#ff00ff#008000#008000#008000#008000
#ff24ff#ff24ff#da00da#da00da#249224#249224#006d00#006d00
#ff48ff#ff48ff#b600b6#b600b6#48a448#48a448#005b00#005b00
#ff6dff#ff6dff#910091#910091#6db66d#6db66d#004900#004900
#ff91ff#ff91ff#6d006d#6d006d#91c891#91c891#003600#003600
#ffb6ff#ffb6ff#480048#480048#b6dab6#b6dab6#002400#002400
#ffdaff#ffdaff#240024#240024#daecda#daecda#001200#001200
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #ff00ff und Farbwert #008000

Wechsel der Hintergrundfarbe bei Hover mit Befehl input

Die Hintergrundfarbe soll sich von Farbwert #ff00ff auf Farbwert #008000 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <input> in Farbwert #ff00ff vor.

Wir legen für dieses Beispiel bei <input> die Hintergrundfarbe auf Farbwert #ff00ff fest.

<style type="text/css"><!--
  input { 
    background-color:#f0f;
  }
//-->
</style>
Jetzt stellen wir ein, dass bei Hover die Hintergrundfarbe auf #008000 geändert wird.
<style type="text/css"><!--
  input:hover { 
    background-color:#008000;
  }
//-->
</style>

Weiteres zu input finden Sie in Formulare in HTML. Der hier gezeigte HTML-Befehl input ist in der HTML Referenz unter <input> ausführlich beschrieben.

Wechsel der Umrandung bei Hover mit Befehl dt

Die Rahmenfarbe soll sich von Farbwert #ff00ff auf Farbwert #008000 ändern, wenn man mit der Maus auf <dt> zeigt. Bereiten wir zunächst die Formatierung von <dt> in Farbwert #ff00ff vor.

In diesem Beispiel umranden wir <dt> mit einem 2 Pixel dicken, gefurchten Rahmen in Farbwert #ff00ff.

<style type="text/css"><!--
  dt { border:2px groove #ff00ff; }
//-->
</style>
Nun fordern wir, dass sich bei Berührung mit der Maus die Rahmenfarbe zu #008000 ändert.
<style type="text/css"><!--
  dt:hover { 
    border-color:#008000;
  }
//-->
</style>

Weiteres zum Thema dt erfahren Sie in Listen und Glossare in HTML. Möglichkeiten vom hier genutzten Tag dt sind in der HTML Referenz unter <dt> zusammengestellt.

Tabelle der 17 HTML Farbnamen

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

Weitere Farbtabellen