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

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 #ffff00

DetailHintergrund #ff00ff DetailSchrift #ffff00 
Farbwert :#ff00ffFarbwert :#ffff00
Farbe :fuchsiaFarbe :yellow
HTML:#ff00ffHTML:#ffff00
HTML (Wert):#ff00ffHTML (Wert):#ffff00
CSS:#ff00ffCSS:#ffff00
CSS (Wert):#ff00ffCSS (Wert):#ffff00
CSS (kürzest):#f0fCSS (kürzest):#ff0
CSS (RGB):rgb(255,0,255)CSS (RGB):rgb(255,255,0)
CSS (%RGB):rgb(100%,0%,100%)CSS (%RGB):rgb(100%,100%,0%)

Verlauf Hintergrundfarbwert #ff00ff nach Schriftfarbwert #ffff00

#ff00ff#ff24da#ff48b6#ff6d91#ff916d#ffb648#ffda24#ffff00
#ff00ff#ff24da#ff48b6#ff6d91#ff916d#ffb648#ffda24#ffff00

Kombination von #ff00ff und #ffff00

Cras id velit ante. 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. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

#ffff00 eignet sich nicht als Schriftfarbe auf Hintergrund #ff00ff. Zwar ist der Farbunterschied ok, der Helligkeitsunterschied ist jedoch zu gering.

Die Ähnlichkeit der Farben #ffff00 und #ff00ff ergibt sich zu 86.09%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 13.91%.

Hintergrundfarbwert #ff00ff

Schriftfarbwert #ffff00

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#ff00ff#ff00ff#ff00ff#ff00ff#ffff00#ffff00#ffff00#ffff00
#ff24ff#ff24ff#da00da#da00da#ffff24#ffff24#dada00#dada00
#ff48ff#ff48ff#b600b6#b600b6#ffff48#ffff48#b6b600#b6b600
#ff6dff#ff6dff#910091#910091#ffff6d#ffff6d#919100#919100
#ff91ff#ff91ff#6d006d#6d006d#ffff91#ffff91#6d6d00#6d6d00
#ffb6ff#ffb6ff#480048#480048#ffffb6#ffffb6#484800#484800
#ffdaff#ffdaff#240024#240024#ffffda#ffffda#242400#242400
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #ff00ff und Farbwert #ffff00

Wechsel der Umrandung bei Hover von Befehl a

Einen Link setzt man mit HTML-Befehl <a> und kann farblich gestaltet und hervorgehoben werden.

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

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

<style type="text/css"><!--
  a { 
    border-color:#f0f; 
    border-style:groove; 
    border-width:3px;
  }
//-->
</style>
Jetzt fordern wir, dass sich bei Mausberührung die Rahmenfarbe auf #ffff00 ändert.
<style type="text/css"><!--
  a: hover { 
    border-color: #ffff00;
  }
//-->
</style>

Mehr zu a lesen Sie in Verweise und Protokolle in HTML. Der hier verwendete HTML-Tag a ist in der HTML Referenz unter <a> genau gezeigt.

Füllen und Umranden bei HTML-Tag hr

Hier umranden wir <hr> mit einem gestrichelten, 4 Pixel dicken Rahmen in Farbwert #ffff00 . Den Hintergrund von <hr> setzen wir auf Farbwert #ff00ff. Das geht mit HTML kaum. Daher nutzen wir hier CSS zur Formatierung.

<style type="text/css"><!--
  hr { 
    border-width:4px; 
    border-style:dashed; 
    background-color:#f0f; 
    border-color:#ff0;
  }
//-->
</style>

Weiteres zum Thema können Sie in Grundlegende Gestaltungselemente in HTML lesen. Weiteres zum HTML-Tag <hr>.

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