Ressourcen: 17 HTML Standard Farbnamen - Kombination von Farbe gray und Farbe aqua

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 gray

Schriftfarbe aqua

DetailHintergrund gray DetailSchrift aqua 
Farbe :grayFarbe :aqua
Farbwert :#808080Farbwert :#00ffff
HTML:grayHTML:aqua
HTML (Wert):#808080HTML (Wert):#00ffff
CSS:grayCSS:aqua
CSS (Wert):#808080CSS (Wert):#00ffff
CSS (kürzest):#808080CSS (kürzest):#0ff
CSS (RGB):rgb(128,128,128)CSS (RGB):rgb(0,255,255)
CSS (%RGB):rgb(50%,50%,50%)CSS (%RGB):rgb(0%,100%,100%)

Verlauf Hintergrundfarbe gray nach Schriftfarbe aqua

#808080#6d9292#5ba4a4#49b6b6#36c8c8#24dada#12ecec#00ffff
#808080#6d9292#5ba4a4#49b6b6#36c8c8#24dada#12ecec#00ffff

Kombination von gray und aqua

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id velit ante. 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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.

aqua ist nicht als Schriftfarbe auf Hintergrund gray geeignet. Die Helligkeit und Farben sind sich zu ähnlich.

Die Ähnlichkeit der Farben aqua und gray ergibt sich zu 85.00%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 15.00%.

Hintergrundfarbe gray

Schriftfarbe aqua

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#808080#808080#808080#808080#00ffff#00ffff#00ffff#00ffff
#929292#929292#6d6d6d#6d6d6d#24ffff#24ffff#00dada#00dada
#a4a4a4#a4a4a4#5b5b5b#5b5b5b#48ffff#48ffff#00b6b6#00b6b6
#b6b6b6#b6b6b6#494949#494949#6dffff#6dffff#009191#009191
#c8c8c8#c8c8c8#363636#363636#91ffff#91ffff#006d6d#006d6d
#dadada#dadada#242424#242424#b6ffff#b6ffff#004848#004848
#ececec#ececec#121212#121212#daffff#daffff#002424#002424
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe gray und Farbe aqua

Füllen und Umranden mit Tag a

Ein Hyperlink wird mit HTML-Befehl <a> erzeugt. Diesen kann man farblich gestalten und hervorheben.

Für dieses Beispiel umranden wir <a> mit einem gestrichelten, 4 Pixel dicken Rahmen in Farbe aqua . Den Hintergrund von <a> färben wir entsprechend mit Farbe gray. Das geht mit HTML nicht. Deshalb verwenden wir hier CSS.

<style type="text/css"><!--
  a { 
    border-width:4px; 
    background-color:gray; 
    border-style:dashed; 
    border-color:aqua;
  }
//-->
</style>

Mehr zum Thema a erfahren Sie in Verweise und Protokolle in HTML. Mehr zum hier genutzten HTML-Tag a finden Sie in der HTML Referenz unter <a>.

Hintergrund/Text-Kombination mit HTML-Tag p

Hier ändern wir die Textfarbe von <p> auf Farbe aqua und die Hintergrundfarbe von <p> auf Farbe gray. Die Schriftart ändern wir auf monospace und setzen die Schriftgröße auf 9pt.

<style type="text/css"><!--
  p { 
    color:aqua; 
    font-size:9pt; 
    background-color:gray; 
    font-family:monospace;
  }
//-->
</style>

Weiteres zum Thema p finden Sie in Grundlegende Gestaltungselemente in HTML. Weiteres zum Befehl <p>.

Tabelle der 17 HTML Farbnamen

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

Weitere Farbtabellen