Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #f5f5dc und Farbe seashell

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

Schriftfarbe seashell

DetailHintergrund #f5f5dc DetailSchrift seashell 
Farbwert :#f5f5dcFarbe :seashell
Farbe :beigeFarbwert :#fff5ee
HTML:#f5f5dcHTML:seashell
HTML (Wert):#f5f5dcHTML (Wert):#fff5ee
CSS:#f5f5dcCSS:seashell
CSS (Wert):#f5f5dcCSS (Wert):#fff5ee
CSS (kürzest):#f5f5dcCSS (kürzest):#fff5ee
CSS (RGB):rgb(245,245,220)CSS (RGB):rgb(255,245,238)
CSS (%RGB):rgb(96%,96%,86%)CSS (%RGB):rgb(100%,96%,93%)

Verlauf Hintergrundfarbwert #f5f5dc nach Schriftfarbe seashell

#f5f5dc#f6f5de#f7f5e1#f9f5e3#faf5e6#fcf5e8#fdf5eb#fff5ee
#f5f5dc#f6f5de#f7f5e1#f9f5e3#faf5e6#fcf5e8#fdf5eb#fff5ee

Kombination von #f5f5dc und seashell

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

seashell ist nicht als Schriftfarbe auf Hintergrund #f5f5dc geeignet, da weder der Helligkeitsunterschied noch der Farbunterschied geeignet sind.

Die Ähnlichkeit von seashell und #f5f5dc beträgt 95.09%. Die Lesbarkeit dieser Kombination ergibt sich zu 4.91%.

Hintergrundfarbwert #f5f5dc

Schriftfarbe seashell

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#f5f5dc#f5f5dc#f5f5dc#f5f5dc#fff5ee#fff5ee#fff5ee#fff5ee
#f6f6e1#f6f6e1#d2d2bc#d2d2bc#fff6f0#fff6f0#dad2cc#dad2cc
#f7f7e6#f7f7e6#afaf9d#afaf9d#fff7f2#fff7f2#b6afaa#b6afaa
#f9f9eb#f9f9eb#8c8c7d#8c8c7d#fff9f5#fff9f5#918c88#918c88
#fafaf0#fafaf0#69695e#69695e#fffaf7#fffaf7#6d6966#6d6966
#fcfcf5#fcfcf5#46463e#46463e#fffcfa#fffcfa#484644#484644
#fdfdfa#fdfdfa#23231f#23231f#fffdfc#fffdfc#242322#242322
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiel zur Kombination von Farbwert #f5f5dc und Farbe seashell

Wechsel der Unterstreichung bei Hover von Befehl a

Einen Verweis setzt man mit Tag <a>. Diesen kann man farblich gestalten.

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

In diesem Beispiel unterstreichen wir <a> mit Hilfe eines einfallenden Rahmens mit 5 Pixel Dicke in Farbwert #f5f5dc.

<style type="text/css"><!--
  a { 
    border-bottom-style: inset; 
    border-bottom-width: 5px; 
    border-bottom-color: #f5f5dc;
  }
//-->
</style>
Nun stellen wir ein, dass bei Mausberührung die Unterstreichungsfarbe auf seashell geändert wird.
<style type="text/css"><!--
  a:hover { 
    border-bottom-color:seashell;
  }
//-->
</style>

Die Idee ist, unabhängige Formatierungen für Inhalt und Unterstreichung zu nutzen. Manchmal sieht man diesen Effekt bei Links. Der Text ist in einer Farbe. Und die Unterstreichung in einer anderen. Hierbei handelt es sich aber nicht um eine normale Unterstreichung, der Text ist überhaupt nicht unterstrichen. Sie wird mit einem Rahmen simuliert und dieser Rahmen ist unabhängig vom Text.

Weiteres zum Thema können Sie in Verweise und Protokolle in HTML lesen. Weiteres zum hier gezeigten HTML-Tag <a>.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen