Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #a52a2a und Farbwert #daa520

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 #a52a2a

Schriftfarbwert #daa520

DetailHintergrund #a52a2a DetailSchrift #daa520 
Farbwert :#a52a2aFarbwert :#daa520
Farbe :brownFarbe :goldenrod
HTML:#a52a2aHTML:#daa520
HTML (Wert):#a52a2aHTML (Wert):#daa520
CSS:#a52a2aCSS:#daa520
CSS (Wert):#a52a2aCSS (Wert):#daa520
CSS (kürzest):#a52a2aCSS (kürzest):#daa520
CSS (RGB):rgb(165,42,42)CSS (RGB):rgb(218,165,32)
CSS (%RGB):rgb(64%,16%,16%)CSS (%RGB):rgb(85%,64%,12%)

Verlauf Hintergrundfarbwert #a52a2a nach Schriftfarbwert #daa520

#a52a2a#ac3b28#b44d27#bb5e25#c37024#ca8122#d29321#daa520
#a52a2a#ac3b28#b44d27#bb5e25#c37024#ca8122#d29321#daa520

Kombination von #a52a2a und #daa520

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

Die Ähnlichkeit der Farben #daa520 und #a52a2a ergibt sich zu 84.93%. Die Lesbarkeit dieser Kombination ergibt sich zu 15.07%.

Auf Hintergrund #a52a2a ist #daa520 ungeeignet, da weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind.

Hintergrundfarbwert #a52a2a

Schriftfarbwert #daa520

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#a52a2a#a52a2a#a52a2a#a52a2a#daa520#daa520#daa520#daa520
#b14848#b14848#8d2424#8d2424#dfb13f#dfb13f#ba8d1b#ba8d1b
#be6666#be6666#751e1e#751e1e#e4be5f#e4be5f#9b7516#9b7516
#cb8585#cb8585#5e1818#5e1818#e9cb7f#e9cb7f#7c5e12#7c5e12
#d8a3a3#d8a3a3#461212#461212#efd89f#efd89f#5d460d#5d460d
#e5c2c2#e5c2c2#2f0c0c#2f0c0c#f4e5bf#f4e5bf#3e2f09#3e2f09
#f2e0e0#f2e0e0#170606#170606#f9f2df#f9f2df#1f1704#1f1704
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #a52a2a und Farbwert #daa520

Füllen und Umranden mit HTML-Tag dt

Bei diesem Beispiel umranden wir <dt> mit einem . Die Hintergrundfarbe für <dt> färben wir mit Farbwert #a52a2a. Mit HTML geht das kaum. Wir nutzen daher CSS.

<style type="text/css"><!--
  dt { 
    background-color:#a52a2a; 
    border-color:#daa520; 
    border-width:3pt; 
    border-style:groove;
  }
//-->
</style>

Mehr zum Thema dt lesen Sie in Listen und Glossare in HTML. Die Beschreibung des hier genutzten Befehl dt finden Sie in der HTML Referenz unter <dt>.

Wechsel der Textfarbe bei Hover mit Tag li

Die Textfarbe soll sich von Farbwert #a52a2a auf Farbwert #daa520 ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Formatierung von <li> in Farbwert #a52a2a vor.

Wir ändern zum Beispiel die Textfarbe von <li> auf Farbwert #a52a2a. Die Größe der Schrift setzen wir auf 13pt:

<style type="text/css"><!--
  li { 
    color: #a52a2a; 
    font-size: 13pt;
  }
//-->
</style>
Nun stellen wir ein, dass sich bei Berührung mit der Maus die Textfarbe auf #daa520 ändert.
<style type="text/css"><!--
  li: hover { 
    color: #daa520;
  }
//-->
</style>

Mehr zu li lesen Sie in Listen und Glossare in HTML. Möglichkeiten des Tag li sind in der HTML Referenz unter <li> ausführlich gezeigt.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen