Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #f5fffa und Farbwert #e9967a

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

Schriftfarbwert #e9967a

DetailHintergrund #f5fffa DetailSchrift #e9967a 
Farbwert :#f5fffaFarbwert :#e9967a
Farbe :mintcreamFarbe :darksalmon
HTML:#f5fffaHTML:#e9967a
HTML (Wert):#f5fffaHTML (Wert):#e9967a
CSS:#f5fffaCSS:#e9967a
CSS (Wert):#f5fffaCSS (Wert):#e9967a
CSS (kürzest):#f5fffaCSS (kürzest):#e9967a
CSS (RGB):rgb(245,255,250)CSS (RGB):rgb(233,150,122)
CSS (%RGB):rgb(96%,100%,98%)CSS (%RGB):rgb(91%,58%,47%)

Verlauf Hintergrundfarbwert #f5fffa nach Schriftfarbwert #e9967a

#f5fffa#f3f0e7#f1e1d5#efd2c3#eec3b0#ecb49e#eaa58c#e9967a
#f5fffa#f3f0e7#f1e1d5#efd2c3#eec3b0#ecb49e#eaa58c#e9967a

Kombination von #f5fffa und #e9967a

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

Die Ähnlichkeit der Farben #e9967a und #f5fffa beträgt 89.25%. Die Lesbarkeit dieser Kombination bewerte ich mit 10.75%.

#e9967a eignet sich nicht als Schriftfarbe auf Hintergrund #f5fffa, da weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind.

Hintergrundfarbwert #f5fffa

Schriftfarbwert #e9967a

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#f5fffa#f5fffa#f5fffa#f5fffa#e9967a#e9967a#e9967a#e9967a
#f6fffa#f6fffa#d2dad6#d2dad6#eca58d#eca58d#c78068#c78068
#f7fffb#f7fffb#afb6b2#afb6b2#efb4a0#efb4a0#a66b57#a66b57
#f9fffc#f9fffc#8c918e#8c918e#f2c3b3#f2c3b3#855545#855545
#fafffc#fafffc#696d6b#696d6b#f5d2c6#f5d2c6#634034#634034
#fcfffd#fcfffd#464847#464847#f8e1d9#f8e1d9#422a22#422a22
#fdfffe#fdfffe#232423#232423#fbf0ec#fbf0ec#211511#211511
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #f5fffa und Farbwert #e9967a

Wechsel der Hintergrundfarbe bei Hover von HTML-Tag fieldset

Die Hintergrundfarbe soll sich von Farbwert #f5fffa auf Farbwert #e9967a ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst die Formatierung von <fieldset> in Farbwert #f5fffa vor.

Wir legen hier bei <fieldset> die Hintergrundfarbe auf Farbwert #f5fffa fest. Die Textfarbe behalten wir bei, setzen jedoch die Schriftart auf arial und setzen die Schriftgröße auf 125%.

<style type="text/css"><!--
  fieldset { 
    font-family:arial; 
    background-color:#f5fffa; 
    font-size:125%;
  }
//-->
</style>
Jetzt stellen wir ein, dass sich bei Hover die Hintergrundfarbe auf #e9967a ändert.
<style type="text/css"><!--
  fieldset: hover { 
    background-color: #e9967a;
  }
//-->
</style>

Mehr zu fieldset können Sie in Formulare in HTML nachsehen. Die Beschreibung vom hier gezeigten HTML-Befehl fieldset finden Sie in der HTML Referenz unter <fieldset>.

Wechsel der Textfarbe bei Hover bei Befehl h2

Mit HTML-Befehl <h2> wird eine Überschrift gesetzt und kann hervorgehoben und farblich gestaltet werden.

Die Textfarbe soll sich von Farbwert #f5fffa auf Farbwert #e9967a ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <h2> in Farbwert #f5fffa vor.

Wir ändern zum Beispiel bei <h2> die Textfarbe auf Farbwert #f5fffa. Die Hintergrundfarbe lassen wir unverändert, ändern jedoch die Schriftart auf monospace:

<style type="text/css"><!--
  h2 { 
    font-family:monospace; 
    color:#f5fffa;
  }
//-->
</style>
Jetzt fordern wir, dass sich bei Mausberührung die Textfarbe zu #e9967a ändert.
<style type="text/css"><!--
  h2:hover { 
    color:#e9967a;
  }
//-->
</style>

Mehr zu h2 finden Sie in Grundlegende Gestaltungselemente in HTML. Zur Beschreibung des HTML-Tag <h2>.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen