Ressourcen: 120 HTML Farbnamen - Kombinationen mit Farbwert #556b2f

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.

Hintergrundfarbwert #556b2f

DetailHintergrundfarbwert #556b2f Verlauf nach WeißVerlauf nach Schwarz
Farbwert :#556b2f#556b2f#556b2f#556b2f#556b2f
Farbe :darkolivegreen#6d804c#6d804c#485b28#485b28
HTML:#556b2f#85956a#85956a#3c4c21#3c4c21
CSS:#556b2f#9daa88#9daa88#303d1a#303d1a
CSS (Wert):#556b2f#b6bfa5#b6bfa5#242d14#242d14
CSS (kürzest):#556b2f#ced4c3#ced4c3#181e0d#181e0d
CSS (RGB):rgb(85,107,47)#e6e9e1#e6e9e1#0c0f06#0c0f06
CSS (%RGB):rgb(33%,41%,18%)#ffffff#ffffff#000000#000000

Beispiele zu Kombinationen mit Farbwert #556b2f

Änderung der Hintergrundfarbe bei Hover von HTML-Befehl em

Die Hintergrundfarbe soll sich ändern, wenn man mit der Maus darauf zeigt. Für das Beispiel bereiten wir zunächst Formatierungen von <em> vor.

Für dieses Beispiel ändern wir bei <em> die Hintergrundfarbe auf Farbwert #556b2f. Die Textfarbe lassen wir unverändert. Die Schriftart setzen wir auf monospace und vergrößern die Größe der Schrift auf 121%:

<style type="text/css"><!--
  em { 
    background-color: #625c06; 
    font-family: monospace; 
    font-size: 121%;
  }
//-->
</style>
Nun stellen wir ein, dass bei Hover die Hintergrundfarbe auf Farbwert #556b2f gesetzt wird.
<style type="text/css"><!--
  em:hover { 
    background-color:#556b2f;
  }
//-->
</style>

Weiteres zu em können Sie in Text in HTML erfahren. Der Befehl em ist in der HTML Referenz bei <em> genau beschrieben.

Umrandung von Befehl center

In diesem Beispiel umranden wir <center> mit einem 5 Pixel dicken, gefurchten Rahmen in Farbwert #556b2f. Dies ist in HTML nicht möglich. Daher nutzen wir hier CSS.

<style type="text/css"><!--
  center { border:5px groove #556b2f; }
//-->
</style>

Mehr zum Thema finden Sie in Grundlegende Gestaltungselemente in HTML. Einzelheiten des Befehl center finden Sie in der HTML Referenz unter <center>.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen