Ressourcen: 137 HTML Farbnamen - Kombination von Farbe white und Farbwert #ffdab9

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.

Hintergrundfarbe white

Schriftfarbwert #ffdab9

DetailHintergrund white DetailSchrift #ffdab9 
Farbe :whiteFarbwert :#ffdab9
Farbwert :#ffffffFarbe :peachpuff
HTML:whiteHTML:#ffdab9
HTML (Wert):#ffffffHTML (Wert):#ffdab9
CSS:whiteCSS:#ffdab9
CSS (Wert):#ffffffCSS (Wert):#ffdab9
CSS (kürzest):#fffCSS (kürzest):#ffdab9
CSS (RGB):rgb(255,255,255)CSS (RGB):rgb(255,218,185)
CSS (%RGB):rgb(100%,100%,100%)CSS (%RGB):rgb(100%,85%,72%)

Verlauf Hintergrundfarbe white nach Schriftfarbwert #ffdab9

#ffffff#fff9f5#fff4eb#ffefe1#ffe9d7#ffe4cd#ffdfc3#ffdab9
#ffffff#fff9f5#fff4eb#ffefe1#ffe9d7#ffe4cd#ffdfc3#ffdab9

Kombination von white und #ffdab9

Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante. Aliquam dapibus, lorem sed bibendum consectetur, ligula enim dignissim ligula, a ultrices dolor augue ultrices magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.

Die Ähnlichkeit der Farben #ffdab9 und white beträgt 93.74%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 6.26%.

#ffdab9 ist nicht als Schriftfarbe auf Hintergrund white geeignet. Die Helligkeit und Farben sind zu ähnlich.

Hintergrundfarbe white

Schriftfarbwert #ffdab9

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#ffffff#ffffff#ffffff#ffffff#ffdab9#ffdab9#ffdab9#ffdab9
#ffffff#ffffff#dadada#dadada#ffdfc3#ffdfc3#daba9e#daba9e
#ffffff#ffffff#b6b6b6#b6b6b6#ffe4cd#ffe4cd#b69b84#b69b84
#ffffff#ffffff#919191#919191#ffe9d7#ffe9d7#917c69#917c69
#ffffff#ffffff#6d6d6d#6d6d6d#ffefe1#ffefe1#6d5d4f#6d5d4f
#ffffff#ffffff#484848#484848#fff4eb#fff4eb#483e34#483e34
#ffffff#ffffff#242424#242424#fff9f5#fff9f5#241f1a#241f1a
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe white und Farbwert #ffdab9

Zebra-Effekt mit Tag tr

Man spricht von einem so genannten Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe verwendet werden. Er unterstützt das Auge beispielsweise die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ung und .ger für <tr> mit unterschiedlichen Hintergrundfarben Farbe white und Farbwert #ffdab9.

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

Diese CSS-Klassen werden dann abwechselnd verwendet.

<table>
<tr class="ung"><td>R1.1</td><td>R2.1</td><td>R3.1</td></tr>
<tr class="ger"><td>R1.2</td><td>R2.2</td><td>R3.2</td></tr>
<tr class="ung"><td>R1.3</td><td>R2.3</td><td>R3.3</td></tr>
</table>

Weiteres zum Thema können Sie in Tabellen in HTML erfahren. Möglichkeiten vom hier verwendeten Tag tr sind in der HTML Referenz bei <tr> genau zusammengestellt.

Wechsel der Umrandung bei Hover bei Befehl img

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

In diesem Beispiel umranden wir <img> mit einem 5 Pixel dicken, gefurchten Rahmen in Farbe white.

<style type="text/css"><!--
  img { 
    border-color: white; 
    border-style: groove; 
    border-width: 5px;
  }
//-->
</style>
Nun fordern wir, dass bei Hover die Rahmenfarbe auf #ffdab9 gesetzt wird.
<style type="text/css"><!--
  img:hover { 
    border-color:#ffdab9;
  }
//-->
</style>

Mehr zu img lesen Sie in Grafik in HTML. Einzelheiten vom hier verwendeten Befehl <img>.

Tabelle der 137 HTML Farbnamen

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

Weitere Farbtabellen