Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ffdab9 und Farbwert #bc8f8f

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

Schriftfarbwert #bc8f8f

DetailHintergrund #ffdab9 DetailSchrift #bc8f8f 
Farbwert :#ffdab9Farbwert :#bc8f8f
Farbe :peachpuffFarbe :rosybrown
HTML:#ffdab9HTML:#bc8f8f
HTML (Wert):#ffdab9HTML (Wert):#bc8f8f
CSS:#ffdab9CSS:#bc8f8f
CSS (Wert):#ffdab9CSS (Wert):#bc8f8f
CSS (kürzest):#ffdab9CSS (kürzest):#bc8f8f
CSS (RGB):rgb(255,218,185)CSS (RGB):rgb(188,143,143)
CSS (%RGB):rgb(100%,85%,72%)CSS (%RGB):rgb(73%,56%,56%)

Verlauf Hintergrundfarbwert #ffdab9 nach Schriftfarbwert #bc8f8f

#ffdab9#f5cfb3#ebc4ad#e2b9a7#d8afa1#cfa49b#c59995#bc8f8f
#ffdab9#f5cfb3#ebc4ad#e2b9a7#d8afa1#cfa49b#c59995#bc8f8f

Kombination von #ffdab9 und #bc8f8f

Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque. 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.

#bc8f8f ist nicht als Schriftfarbe auf Hintergrund #ffdab9 geeignet, da die Unterschiede in der Helligkeit und Farbe zu gering sind.

Die Ähnlichkeit der Farben #bc8f8f und #ffdab9 beträgt 89.80%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 10.20%.

Hintergrundfarbwert #ffdab9

Schriftfarbwert #bc8f8f

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#ffdab9#ffdab9#ffdab9#ffdab9#bc8f8f#bc8f8f#bc8f8f#bc8f8f
#ffdfc3#ffdfc3#daba9e#daba9e#c59f9f#c59f9f#a17a7a#a17a7a
#ffe4cd#ffe4cd#b69b84#b69b84#cfafaf#cfafaf#866666#866666
#ffe9d7#ffe9d7#917c69#917c69#d8bfbf#d8bfbf#6b5151#6b5151
#ffefe1#ffefe1#6d5d4f#6d5d4f#e2cfcf#e2cfcf#503d3d#503d3d
#fff4eb#fff4eb#483e34#483e34#ebdfdf#ebdfdf#352828#352828
#fff9f5#fff9f5#241f1a#241f1a#f5efef#f5efef#1a1414#1a1414
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #ffdab9 und Farbwert #bc8f8f

Wechsel der Textfarbe bei Hover mit Befehl a

Einen Link setzt man mit Befehl <a> und kann hervorgehoben und farblich gestaltet werden.

Die Textfarbe soll sich von Farbwert #ffdab9 auf Farbwert #bc8f8f ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Formatierung von <a> in Farbwert #ffdab9 vor.

Z.B. legen wir bei <a> die Textfarbe auf Farbwert #ffdab9 fest. Zwar behalten wir die Hintergrundfarbe bei, ändern jedoch die Schriftart auf verdana und setzen die Schriftgröße auf 13px.

<style type="text/css"><!--
  a { 
    color: #ffdab9; 
    font-family: verdana; 
    font-size: 13px;
  }
//-->
</style>
Nun stellen wir ein, dass bei Mausberührung die Textfarbe auf #bc8f8f geändert wird.
<style type="text/css"><!--
  a: hover { 
    color: #bc8f8f;
  }
//-->
</style>

Weiteres zu a lesen Sie in Verweise und Protokolle in HTML. Der hier gezeigte Befehl a ist in der HTML Referenz bei <a> ausführlich gezeigt.

Wechsel der Umrandung bei Hover bei Tag frameset

Die Rahmenfarbe soll sich von Farbwert #ffdab9 auf Farbwert #bc8f8f ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Darstellung von <frameset> in Farbwert #ffdab9 vor.

In diesem Beispiel umranden wir <frameset> mit einem 5 Pixel dicken, gestrichelten Rahmen in Farbwert #ffdab9.

<style type="text/css"><!--
  frameset { border:5px dashed #ffdab9; }
//-->
</style>
Nun stellen wir ein, dass bei Berührung mit der Maus die Rahmenfarbe auf #bc8f8f gesetzt wird.
<style type="text/css"><!--
  frameset:hover { 
    border-color:#bc8f8f;
  }
//-->
</style>

Mehr zum hier genutzten Tag frameset ist in der HTML Referenz bei <frameset> genau gezeigt.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen