Ressourcen: 137 HTML Farbnamen - Kombination von Farbwert #f0e68c und Farbe limegreen

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.

Hintergrundfarbwert #f0e68c

Schriftfarbe limegreen

DetailHintergrund #f0e68c DetailSchrift limegreen 
Farbwert :#f0e68cFarbe :limegreen
Farbe :khakiFarbwert :#32cd32
HTML:#f0e68cHTML:limegreen
HTML (Wert):#f0e68cHTML (Wert):#32cd32
CSS:#f0e68cCSS:limegreen
CSS (Wert):#f0e68cCSS (Wert):#32cd32
CSS (kürzest):#f0e68cCSS (kürzest):#32cd32
CSS (RGB):rgb(240,230,140)CSS (RGB):rgb(50,205,50)
CSS (%RGB):rgb(94%,90%,54%)CSS (%RGB):rgb(19%,80%,19%)

Verlauf Hintergrundfarbwert #f0e68c nach Schriftfarbe limegreen

#f0e68c#d4e27f#b9de72#9edb65#83d758#68d44b#4dd03e#32cd32
#f0e68c#d4e27f#b9de72#9edb65#83d758#68d44b#4dd03e#32cd32

Kombination von #f0e68c und limegreen

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.

limegreen eignet sich nicht als Schriftfarbe auf Hintergrund #f0e68c, da die Unterschiede in der Helligkeit und Farbe zu gering sind.

Die Ähnlichkeit von limegreen und #f0e68c beträgt 92.12%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 7.88%.

Hintergrundfarbwert #f0e68c

Schriftfarbe limegreen

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#f0e68c#f0e68c#f0e68c#f0e68c#32cd32#32cd32#32cd32#32cd32
#f2e99c#f2e99c#cdc578#cdc578#4fd44f#4fd44f#2aaf2a#2aaf2a
#f4edac#f4edac#aba464#aba464#6cdb6c#6cdb6c#239223#239223
#f6f0bd#f6f0bd#898350#898350#89e289#89e289#1c751c#1c751c
#f8f4cd#f8f4cd#66623c#66623c#a7e9a7#a7e9a7#155715#155715
#faf7de#faf7de#444128#444128#c4f0c4#c4f0c4#0e3a0e#0e3a0e
#fcfbee#fcfbee#222014#222014#e1f7e1#e1f7e1#071d07#071d07
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #f0e68c und Farbe limegreen

Zebra-Effekt mit HTML-Tag tr

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, spricht man von einem so genannten Zebra-Effekt. Er unterstützt das Auge, etwa die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <tr> mit den Hintergrundfarben Farbwert #f0e68c und Farbe limegreen.

<style type="text/css"><!--
  tr.ung { 
    background-color: #f0e68c;
  }
  tr.ger { 
    background-color: limegreen;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd genutzt.

<table>
<tr class="ung"><td><tt>a/a</td><td></tt>b/a</td><td><tt>c/a</td></tr>
<tr class="ger"><td></tt>a/b</td><td><tt>b/b</td><td></tt>c/b</td></tr>
<tr class="ung"><td><tt>a/c</td><td></tt>b/c</td><td>@c/c</td></tr>
</table>

Weiteres zum Thema tr erfahren Sie in Tabellen in HTML. Die Beschreibung des hier gezeigten HTML-Befehl tr erfahren Sie in der HTML Referenz unter <tr>.

Wechsel der Unterstreichung bei Hover von HTML-Tag cite

Die Unterstreichungsfarbe soll sich von Farbwert #f0e68c auf Farbe limegreen ändern, wenn man mit der Maus auf <cite> zeigt. Bereiten wir zunächst eine Formatierung von <cite> in Farbwert #f0e68c vor.

In diesem Beispiel unterstreichen wir <cite> mit Hilfe eines gezahnten Rahmens mit 3 Pixel Dicke in Farbwert #f0e68c.

<style type="text/css"><!--
  cite { border-bottom:3px ridge #f0e68c; }
//-->
</style>
Nun stellen wir ein, dass bei Hover die Unterstreichungsfarbe auf limegreen geändert wird.
<style type="text/css"><!--
  cite: hover { 
    border-bottom-color: limegreen;
  }
//-->
</style>

Die Idee ist hierbei, unabhängige Formatierungen für Inhalt und Unterstreichung zu nutzen. Manchmal sieht man das bei Links. Der Text wird in einer Farbe dargestellt. Die Unterstreichung in einer anderen. Das ist aber keine normale Unterstreichung, der Text selbst hat gar keine Unterstreichung. Die Unterstreichung wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Möglichkeiten vom HTML-Befehl cite sind in der HTML Referenz unter <cite> ausführlich zusammengestellt.

Tabelle der 137 HTML Farbnamen

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

Weitere Farbtabellen