Ressourcen: 137 HTML Farbnamen - Kombination von Farbe olive und Farbe lightcyan

von Thomas Salvador.

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

Netscape führte seinerzeit die websicheren Farben ein. Neben diesen, einem bestimmten Schema folgenden, Farbwerten, definierte man noch 120 Werte und ordnete ihnen Namen zu. Zusammen mit den 17 Standard-HTML-Farben, die ebenfalls Namen haben, ergeben sich so 137 HTML Farbnamen.

Hintergrundfarbe olive

Schriftfarbe lightcyan

DetailHintergrund olive DetailSchrift lightcyan 
Farbe :oliveFarbe :lightcyan
Farbwert :#808000Farbwert :#e0ffff
HTML:oliveHTML:lightcyan
HTML (Wert):#808000HTML (Wert):#e0ffff
CSS:oliveCSS:lightcyan
CSS (Wert):#808000CSS (Wert):#e0ffff
CSS (kürzest):#808000CSS (kürzest):#e0ffff
CSS (RGB):rgb(128,128,0)CSS (RGB):rgb(224,255,255)
CSS (%RGB):rgb(50%,50%,0%)CSS (%RGB):rgb(87%,100%,100%)

Verlauf Hintergrundfarbe olive nach Schriftfarbe lightcyan

#808000#8d9224#9ba448#a9b66d#b6c891#c4dab6#d2ecda#e0ffff
#808000#8d9224#9ba448#a9b66d#b6c891#c4dab6#d2ecda#e0ffff

Kombination von olive und lightcyan

Cras vestibulum tristique erat, ac interdum justo cursus in. 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. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.

Die Ähnlichkeit der Farben lightcyan und olive beträgt 81.05%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 18.95%.

lightcyan ist nicht als Schriftfarbe auf Hintergrund olive geeignet. Zwar ist der Helligkeitsunterschied in Ordnung, die Farben selbst sind sich zu ähnlich.

Hintergrundfarbe olive

Schriftfarbe lightcyan

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#808000#808000#808000#808000#e0ffff#e0ffff#e0ffff#e0ffff
#929224#929224#6d6d00#6d6d00#e4ffff#e4ffff#c0dada#c0dada
#a4a448#a4a448#5b5b00#5b5b00#e8ffff#e8ffff#a0b6b6#a0b6b6
#b6b66d#b6b66d#494900#494900#edffff#edffff#809191#809191
#c8c891#c8c891#363600#363600#f1ffff#f1ffff#606d6d#606d6d
#dadab6#dadab6#242400#242400#f6ffff#f6ffff#404848#404848
#ececda#ececda#121200#121200#faffff#faffff#202424#202424
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe olive und Farbe lightcyan

Füllen und Umranden von HTML-Befehl q

Für dieses Beispiel umranden wir <q> mit einem einfallenden, 2 Pixel dicken Rahmen in Farbe lightcyan . Den Hintergrund von <q> setzen wir entsprechend auf Farbe olive. Dies geht mit HTML kaum. Wir verwenden deshalb CSS.

<style type="text/css"><!--
  q { border:2px inset lightcyan; background-color:olive; }
//-->
</style>

Die Beschreibung des hier gezeigten Befehl q lesen Sie in der HTML Referenz unter <q>.

Wechsel der Unterstreichung bei Hover mit HTML-Tag legend

Die Farbe der Unterstreichung soll sich von Farbe olive auf Farbe lightcyan ändern, wenn man mit der Maus auf <legend> zeigt. Bereiten wir zunächst eine Darstellung von <legend> in Farbe olive vor.

Hier unterstreichen wir <legend> mit Hilfe eines gefurchten Rahmens mit 2 Pixel Dicke in Farbe olive.

<style type="text/css"><!--
  legend { border-bottom:2px groove olive; }
//-->
</style>
Nun fordern wir, dass bei Hover die Farbe der Unterstreichung auf lightcyan geändert wird.
<style type="text/css"><!--
  legend:hover { 
    border-bottom-color:lightcyan;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu verwenden. Öfter sehen Sie das bei Hyperlinks. Der Text wird in einer Farbe dargestellt. Und die Unterstreichung in einer anderen. Hierbei handelt es sich jedoch nicht um eine "wirkliche" Unterstreichung, der Text ist gar nicht unterstrichen. Die Unterstreichung wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Mehr zu legend erfahren Sie in Formulare in HTML. Einzelheiten vom Befehl <legend>.

Tabelle der 137 HTML Farbnamen

Hintergrund Farbwert Farbe undSchrift Farbwert Farbkombination
aliceblue #f0f8ff         +  aliceblue #f0f8ff aliceblue / olive
antiquewhite #faebd7         +  antiquewhite #faebd7 antiquewhite / olive
aqua #00ffff         +  aqua #00ffff aqua / olive
aquamarine #7fffd4         +  aquamarine #7fffd4 aquamarine / olive
azure #f0ffff         +  azure #f0ffff azure / olive
beige #f5f5dc         +  beige #f5f5dc beige / olive
black #000000         +  black #000000 black / olive
blue #0000ff         +  blue #0000ff blue / olive
blueviolet #8a2be2         +  blueviolet #8a2be2 blueviolet / olive
brown #a52a2a         +  brown #a52a2a brown / olive
burlywood #deb887         +  burlywood #deb887 burlywood / olive
cadetblue #5f9ea0         +  cadetblue #5f9ea0 cadetblue / olive
chartreuse #7fff00         +  chartreuse #7fff00 chartreuse / olive
chocolate #d2691e         +  chocolate #d2691e chocolate / olive
coral #ff7f50         +  coral #ff7f50 coral / olive
cornflowerblue #6495ed         +  cornflowerblue #6495ed cornflowerblue / olive
cornsilk #fff8dc         +  cornsilk #fff8dc cornsilk / olive
crimson #dc143c         +  crimson #dc143c crimson / olive
darkblue #00008b         +  darkblue #00008b darkblue / olive
darkcyan #008b8b         +  darkcyan #008b8b darkcyan / olive
darkgoldenrod #b8860b         +  darkgoldenrod #b8860b darkgoldenrod / olive
darkgray #a9a9a9         +  darkgray #a9a9a9 darkgray / olive
darkgreen #006400         +  darkgreen #006400 darkgreen / olive
darkkhaki #bdb76b         +  darkkhaki #bdb76b darkkhaki / olive
darkmagenta #8b008b         +  darkmagenta #8b008b darkmagenta / olive
darkolivegreen #556b2f         +  darkolivegreen #556b2f darkolivegreen / olive
darkorange #ff8c00         +  darkorange #ff8c00 darkorange / olive
darkorchid #9932cc         +  darkorchid #9932cc darkorchid / olive
darkred #8b0000         +  darkred #8b0000 darkred / olive
darksalmon #e9967a         +  darksalmon #e9967a darksalmon / olive
darkseagreen #8fbc8f         +  darkseagreen #8fbc8f darkseagreen / olive
darkslateblue #483d8b         +  darkslateblue #483d8b darkslateblue / olive
darkslategray #2f4f4f         +  darkslategray #2f4f4f darkslategray / olive
darkturquoise #00ced1         +  darkturquoise #00ced1 darkturquoise / olive
darkviolet #9400d3         +  darkviolet #9400d3 darkviolet / olive
deeppink #ff1493         +  deeppink #ff1493 deeppink / olive
deepskyblue #00bfff         +  deepskyblue #00bfff deepskyblue / olive
dimgray #696969         +  dimgray #696969 dimgray / olive
dodgerblue #1e90ff         +  dodgerblue #1e90ff dodgerblue / olive
firebrick #b22222         +  firebrick #b22222 firebrick / olive
floralwhite #fffaf0         +  floralwhite #fffaf0 floralwhite / olive
forestgreen #228b22         +  forestgreen #228b22 forestgreen / olive
fuchsia #ff00ff         +  fuchsia #ff00ff fuchsia / olive
gainsboro #dcdcdc         +  gainsboro #dcdcdc gainsboro / olive
ghostwhite #f8f8ff         +  ghostwhite #f8f8ff ghostwhite / olive
gold #ffd700         +  gold #ffd700 gold / olive
goldenrod #daa520         +  goldenrod #daa520 goldenrod / olive
gray #808080         +  gray #808080 gray / olive
green #008000         +  green #008000 green / olive
greenyellow #adff2f         +  greenyellow #adff2f greenyellow / olive
honeydew #f0fff0         +  honeydew #f0fff0 honeydew / olive
hotpink #ff69b4         +  hotpink #ff69b4 hotpink / olive
indianred #cd5c5c         +  indianred #cd5c5c indianred / olive
indigo #4b0082         +  indigo #4b0082 indigo / olive
ivory #fffff0         +  ivory #fffff0 ivory / olive
khaki #f0e68c         +  khaki #f0e68c khaki / olive
lavender #e6e6fa         +  lavender #e6e6fa lavender / olive
lavenderblush #fff0f5         +  lavenderblush #fff0f5 lavenderblush / olive
lawngreen #7cfc00         +  lawngreen #7cfc00 lawngreen / olive
lemonchiffon #fffacd         +  lemonchiffon #fffacd lemonchiffon / olive
lightblue #add8e6         +  lightblue #add8e6 lightblue / olive
lightcoral #f08080         +  lightcoral #f08080 lightcoral / olive
lightcyan #e0ffff         +  lightcyan #e0ffff lightcyan / olive
lightgoldenrodyellow #fafad2         +  lightgoldenrodyellow #fafad2 lightgoldenrodyellow / olive
lightgreen #90ee90         +  lightgreen #90ee90 lightgreen / olive
lightgrey #d3d3d3         +  lightgrey #d3d3d3 lightgrey / olive
lightpink #ffb6c1         +  lightpink #ffb6c1 lightpink / olive
lightsalmon #ffa07a         +  lightsalmon #ffa07a lightsalmon / olive
lightseagreen #20b2aa         +  lightseagreen #20b2aa lightseagreen / olive
lightskyblue #87cefa         +  lightskyblue #87cefa lightskyblue / olive
lightslategray #778899         +  lightslategray #778899 lightslategray / olive
lightsteelblue #b0c4de         +  lightsteelblue #b0c4de lightsteelblue / olive
lightyellow #ffffe0         +  lightyellow #ffffe0 lightyellow / olive
lime #00ff00         +  lime #00ff00 lime / olive
limegreen #32cd32         +  limegreen #32cd32 limegreen / olive
linen #faf0e6         +  linen #faf0e6 linen / olive
maroon #800000         +  maroon #800000 maroon / olive
mediumaquamarine #66cdaa         +  mediumaquamarine #66cdaa mediumaquamarine / olive
mediumblue #0000cd         +  mediumblue #0000cd mediumblue / olive
mediumorchid #ba55d3         +  mediumorchid #ba55d3 mediumorchid / olive
mediumpurple #9370db         +  mediumpurple #9370db mediumpurple / olive
mediumseagreen #3cb371         +  mediumseagreen #3cb371 mediumseagreen / olive
mediumslateblue #7b68ee         +  mediumslateblue #7b68ee mediumslateblue / olive
mediumspringgreen #00fa9a         +  mediumspringgreen #00fa9a mediumspringgreen / olive
mediumturquoise #48d1cc         +  mediumturquoise #48d1cc mediumturquoise / olive
mediumvioletred #c71585         +  mediumvioletred #c71585 mediumvioletred / olive
midnightblue #191970         +  midnightblue #191970 midnightblue / olive
mintcream #f5fffa         +  mintcream #f5fffa mintcream / olive
mistyrose #ffe4e1         +  mistyrose #ffe4e1 mistyrose / olive
moccasin #ffe4b5         +  moccasin #ffe4b5 moccasin / olive
navajowhite #ffdead         +  navajowhite #ffdead navajowhite / olive
navy #000080         +  navy #000080 navy / olive
oldlace #fdf5e6         +  oldlace #fdf5e6 oldlace / olive
olive #808000         +  olive #808000 olive / olive
olivedrab #6b8e23         +  olivedrab #6b8e23 olivedrab / olive
orange #ffa500         +  orange #ffa500 orange / olive
orangered #ff4500         +  orangered #ff4500 orangered / olive
orchid #da70d6         +  orchid #da70d6 orchid / olive
palegoldenrod #eee8aa         +  palegoldenrod #eee8aa palegoldenrod / olive
palegreen #98fb98         +  palegreen #98fb98 palegreen / olive
paleturquoise #afeeee         +  paleturquoise #afeeee paleturquoise / olive
palevioletred #db7093         +  palevioletred #db7093 palevioletred / olive
papayawhip #ffefd5         +  papayawhip #ffefd5 papayawhip / olive
peachpuff #ffdab9         +  peachpuff #ffdab9 peachpuff / olive
peru #cd853f         +  peru #cd853f peru / olive
pink #ffc0cb         +  pink #ffc0cb pink / olive
plum #dda0dd         +  plum #dda0dd plum / olive
powderblue #b0e0e6         +  powderblue #b0e0e6 powderblue / olive
purple #800080         +  purple #800080 purple / olive
red #ff0000         +  red #ff0000 red / olive
rosybrown #bc8f8f         +  rosybrown #bc8f8f rosybrown / olive
royalblue #4169e1         +  royalblue #4169e1 royalblue / olive
saddlebrown #8b4513         +  saddlebrown #8b4513 saddlebrown / olive
salmon #fa8072         +  salmon #fa8072 salmon / olive
sandybrown #f4a460         +  sandybrown #f4a460 sandybrown / olive
seagreen #2e8b57         +  seagreen #2e8b57 seagreen / olive
seashell #fff5ee         +  seashell #fff5ee seashell / olive
sienna #a0522d         +  sienna #a0522d sienna / olive
silver #c0c0c0         +  silver #c0c0c0 silver / olive
skyblue #87ceeb         +  skyblue #87ceeb skyblue / olive
slateblue #6a5acd         +  slateblue #6a5acd slateblue / olive
slategray #708090         +  slategray #708090 slategray / olive
snow #fffafa         +  snow #fffafa snow / olive
springgreen #00ff7f         +  springgreen #00ff7f springgreen / olive
steelblue #4682b4         +  steelblue #4682b4 steelblue / olive
tan #d2b48c         +  tan #d2b48c tan / olive
teal #008080         +  teal #008080 teal / olive
thistle #d8bfd8         +  thistle #d8bfd8 thistle / olive
tomato #ff6347         +  tomato #ff6347 tomato / olive
turquoise #40e0d0         +  turquoise #40e0d0 turquoise / olive
violet #ee82ee         +  violet #ee82ee violet / olive
wheat #f5deb3         +  wheat #f5deb3 wheat / olive
white #ffffff         +  white #ffffff white / olive
whitesmoke #f5f5f5         +  whitesmoke #f5f5f5 whitesmoke / olive
yellow #ffff00         +  yellow #ffff00 yellow / olive
yellowgreen #9acd32         +  yellowgreen #9acd32 yellowgreen / olive

Weitere Farbtabellen