Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #f0e68c und Farbwert #fffaf0

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

Schriftfarbwert #fffaf0

DetailHintergrund #f0e68c DetailSchrift #fffaf0 
Farbwert :#f0e68cFarbwert :#fffaf0
Farbe :khakiFarbe :floralwhite
HTML:#f0e68cHTML:#fffaf0
HTML (Wert):#f0e68cHTML (Wert):#fffaf0
CSS:#f0e68cCSS:#fffaf0
CSS (Wert):#f0e68cCSS (Wert):#fffaf0
CSS (kürzest):#f0e68cCSS (kürzest):#fffaf0
CSS (RGB):rgb(240,230,140)CSS (RGB):rgb(255,250,240)
CSS (%RGB):rgb(94%,90%,54%)CSS (%RGB):rgb(100%,98%,94%)

Verlauf Hintergrundfarbwert #f0e68c nach Schriftfarbwert #fffaf0

#f0e68c#f2e89a#f4eba8#f6eeb6#f8f1c5#faf4d3#fcf7e1#fffaf0
#f0e68c#f2e89a#f4eba8#f6eeb6#f8f1c5#faf4d3#fcf7e1#fffaf0

Kombination von #f0e68c und #fffaf0

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

#fffaf0 eignet sich nicht als Schriftfarbe auf Hintergrund #f0e68c. Sowohl Helligkeit als auch die Farben sind zu ähnlich.

Die Ähnlichkeit der Farben #fffaf0 und #f0e68c ergibt sich zu 94.14%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 5.86%.

Hintergrundfarbwert #f0e68c

Schriftfarbwert #fffaf0

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#f0e68c#f0e68c#f0e68c#f0e68c#fffaf0#fffaf0#fffaf0#fffaf0
#f2e99c#f2e99c#cdc578#cdc578#fffaf2#fffaf2#dad6cd#dad6cd
#f4edac#f4edac#aba464#aba464#fffbf4#fffbf4#b6b2ab#b6b2ab
#f6f0bd#f6f0bd#898350#898350#fffcf6#fffcf6#918e89#918e89
#f8f4cd#f8f4cd#66623c#66623c#fffcf8#fffcf8#6d6b66#6d6b66
#faf7de#faf7de#444128#444128#fffdfa#fffdfa#484744#484744
#fcfbee#fcfbee#222014#222014#fffefc#fffefc#242322#242322
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiel zur Kombination von Farbwert #f0e68c und Farbwert #fffaf0

Wechsel der Unterstreichung bei Hover von Befehl acronym

Die Unterstreichungsfarbe soll sich von Farbwert #f0e68c auf Farbwert #fffaf0 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst eine Darstellung von <acronym> in Farbwert #f0e68c vor.

In diesem Beispiel unterstreichen wir <acronym> mit Hilfe eines gepunkteten Rahmens mit 5 Pixel Dicke in Farbwert #f0e68c.

<style type="text/css"><!--
  acronym { border-bottom:5px dotted #f0e68c; }
//-->
</style>
Jetzt fordern wir, dass bei Berührung mit der Maus die Farbe der Unterstreichung auf #fffaf0 gesetzt wird.
<style type="text/css"><!--
  acronym:hover { 
    border-bottom-color:#fffaf0;
  }
//-->
</style>

Die Idee ist dabei, unabhängige Formatierungen für Inhalt und Unterstreichung zu haben. Manchmal sehen Sie das bei Verweisen. Der Text ist in einer Farbe. Und die Unterstreichung in einer anderen. Hierbei handelt es sich aber nicht um eine normale Unterstreichung, der Text selbst ist nicht unterstrichen. Sie wird mit einem Rahmen simuliert und dieser ist unabhängig vom Text.

Weiteres zum hier verwendeten HTML-Tag acronym ist in der HTML Referenz bei <acronym> gezeigt.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen