Ressourcen: 120 HTML Farbnamen - Kombination von Farbe lightgreen und Farbe lawngreen

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 Farbwerten, die einem bestimmten Schema folgen, definierte man noch 120 Werte und ordnete ihnen Namen zu.

Hintergrundfarbe lightgreen

Schriftfarbe lawngreen

DetailHintergrund lightgreen DetailSchrift lawngreen 
Farbe :lightgreenFarbe :lawngreen
Farbwert :#90ee90Farbwert :#7cfc00
HTML:lightgreenHTML:lawngreen
HTML (Wert):#90ee90HTML (Wert):#7cfc00
CSS:lightgreenCSS:lawngreen
CSS (Wert):#90ee90CSS (Wert):#7cfc00
CSS (kürzest):#90ee90CSS (kürzest):#7cfc00
CSS (RGB):rgb(144,238,144)CSS (RGB):rgb(124,252,0)
CSS (%RGB):rgb(56%,93%,56%)CSS (%RGB):rgb(48%,98%,0%)

Verlauf Hintergrundfarbe lightgreen nach Schriftfarbe lawngreen

#90ee90#8df07b#8af266#87f452#84f63d#81f829#7efa14#7cfc00
#90ee90#8df07b#8af266#87f452#84f63d#81f829#7efa14#7cfc00

Kombination von lightgreen und lawngreen

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

Die Ähnlichkeit der Farben lawngreen und lightgreen ergibt sich zu 94.93%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 5.07%.

Auf Hintergrund lightgreen ist lawngreen ungeeignet, weil die Unterschiede in der Helligkeit und Farbe unzureichend sind.

Hintergrundfarbe lightgreen

Schriftfarbe lawngreen

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#90ee90#90ee90#90ee90#90ee90#7cfc00#7cfc00#7cfc00#7cfc00
#9ff09f#9ff09f#7bcc7b#7bcc7b#8efc24#8efc24#6ad800#6ad800
#aff2af#aff2af#66aa66#66aa66#a1fc48#a1fc48#58b400#58b400
#bff5bf#bff5bf#528852#528852#b4fd6d#b4fd6d#469000#469000
#cff7cf#cff7cf#3d663d#3d663d#c6fd91#c6fd91#356c00#356c00
#dffadf#dffadf#294429#294429#d9feb6#d9feb6#234800#234800
#effcef#effcef#142214#142214#ecfeda#ecfeda#112400#112400
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe lightgreen und Farbe lawngreen

Füllen und Umranden von Befehl a

Ein Link wird mit HTML-Tag <a> gesetzt. Dieser kann hervorgehoben und farblich gestaltet werden.

Für dieses Beispiel umranden wir <a> mit einem . Den Hintergrund von <a> färben wir entsprechend mit Farbe lightgreen. Mit HTML geht dies nicht. Daher formatieren wir hier mit CSS.

<style type="text/css"><!--
  a { border:2pt dashed lawngreen; background-color:lightgreen; }
//-->
</style>

Mehr zum Thema a können Sie in Verweise und Protokolle in HTML lesen. Möglichkeiten des hier genutzten HTML-Tag a sind in der HTML Referenz bei <a> ausführlich beschrieben.

Zebra-Effekt bei Tag td

Werden zwei Farben abweselnd als Hintergrundfarbe genommen, spricht man vom so genannten Zebra-Effekt. Er unterstützt das Auge, etwa die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ungerade und .gerade für <td> mit unterschiedlichen Hintergrundfarben Farbe lightgreen und Farbe lawngreen.

<style type="text/css"><!--
  td.ungerade { 
    background-color:lightgreen;
  }
  td.gerade { 
    background-color:lawngreen;
  }
//-->
</style>

Diese werden dann abwechselnd genutzt.

<table>
<tr><td class="ungerade">EA~A</td><td class="gerade">EB~A</td><td class="ungerade">EC~A</td></tr>
<tr><td class="ungerade">EA~B</td><td class="gerade">EB~B</td><td class="ungerade">EC~B</td></tr>
<tr><td class="ungerade">EA~C</td><td class="gerade">EB~C</td><td class="ungerade">EC~C</td></tr>
</table>

Weiteres zum Thema können Sie in Tabellen in HTML lesen. Möglichkeiten des Tag td sind in der HTML Referenz bei <td> genau beschrieben.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen