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

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

DetailHintergrund #f5fffa DetailSchrift #a9a9a9 
Farbwert :#f5fffaFarbwert :#a9a9a9
Farbe :mintcreamFarbe :darkgray
HTML:#f5fffaHTML:#a9a9a9
HTML (Wert):#f5fffaHTML (Wert):#a9a9a9
CSS:#f5fffaCSS:#a9a9a9
CSS (Wert):#f5fffaCSS (Wert):#a9a9a9
CSS (kürzest):#f5fffaCSS (kürzest):#a9a9a9
CSS (RGB):rgb(245,255,250)CSS (RGB):rgb(169,169,169)
CSS (%RGB):rgb(96%,100%,98%)CSS (%RGB):rgb(66%,66%,66%)

Verlauf Hintergrundfarbwert #f5fffa nach Schriftfarbwert #a9a9a9

#f5fffa#eaf2ee#dfe6e2#d4dad7#c9cdcb#bec1c0#b3b5b4#a9a9a9
#f5fffa#eaf2ee#dfe6e2#d4dad7#c9cdcb#bec1c0#b3b5b4#a9a9a9

Kombination von #f5fffa und #a9a9a9

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

Die Ähnlichkeit der Farben #a9a9a9 und #f5fffa beträgt 89.04%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 10.96%.

#a9a9a9 eignet sich nicht als Schriftfarbe auf Hintergrund #f5fffa. Die Helligkeit und Farben sind sich zu ähnlich.

Hintergrundfarbwert #f5fffa

Schriftfarbwert #a9a9a9

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#f5fffa#f5fffa#f5fffa#f5fffa#a9a9a9#a9a9a9#a9a9a9#a9a9a9
#f6fffa#f6fffa#d2dad6#d2dad6#b5b5b5#b5b5b5#909090#909090
#f7fffb#f7fffb#afb6b2#afb6b2#c1c1c1#c1c1c1#787878#787878
#f9fffc#f9fffc#8c918e#8c918e#cdcdcd#cdcdcd#606060#606060
#fafffc#fafffc#696d6b#696d6b#dadada#dadada#484848#484848
#fcfffd#fcfffd#464847#464847#e6e6e6#e6e6e6#303030#303030
#fdfffe#fdfffe#232423#232423#f2f2f2#f2f2f2#181818#181818
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #f5fffa und Farbwert #a9a9a9

Wechsel der Unterstreichung bei Hover mit HTML-Befehl legend

Die Unterstreichungsfarbe soll sich von Farbwert #f5fffa auf Farbwert #a9a9a9 ändern, wenn man mit der Maus auf <legend> zeigt. Wir bereiten zunächst eine Darstellung von <legend> in Farbwert #f5fffa vor.

Hier unterstreichen wir <legend> mit einem gestrichelten Rahmen mit 3 Pixel Dicke in Farbwert #f5fffa.

<style type="text/css"><!--
  legend { border-bottom:3px dashed #f5fffa; }
//-->
</style>
Nun fordern wir, dass bei Mausberührung die Unterstreichungsfarbe auf #a9a9a9 gesetzt wird.
<style type="text/css"><!--
  legend:hover { 
    border-bottom-color:#a9a9a9;
  }
//-->
</style>

Die Idee ist dabei, verschiedene Formatierungen für Inhalt und Unterstreichung zu haben. Manchmal sehen Sie dies bei Links. Der Text wird in einer Farbe dargestellt. Die Unterstreichung in einer anderen. Dies ist aber keine wirkliche Unterstreichung, der Text selbst ist gar nicht unterstrichen. Die Unterstreichung wird mit einem Rahmen simuliert und dieser Rahmen ist unabhängig vom Text.

Mehr zum Thema legend können Sie in Formulare in HTML erfahren. Möglichkeiten des hier verwendeten Befehl legend erfahren Sie in der HTML Referenz unter <legend>.

Füllen und Umranden mit Tag form

In diesem Beispiel umranden wir <form> mit einem 5 Pixel dicken, doppelten Rahmen in Farbwert #a9a9a9 . Die Hintergrundfarbe für <form> setzen wir auf Farbwert #f5fffa. Dies ist in HTML so kaum möglich. Daher verwenden wir hier CSS zur Formatierung.

<style type="text/css"><!--
  form { border:5px double #a9a9a9; background-color:#f5fffa; }
//-->
</style>

Weiteres zum Thema können Sie in Formulare in HTML nachlesen. Der Befehl form ist in der HTML Referenz bei <form> genau gezeigt.

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