Ressourcen: 120 HTML Farbnamen - Kombinationen mit Farbwert #ba55d3

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

DetailHintergrundfarbwert #ba55d3 Verlauf nach WeißVerlauf nach Schwarz
Farbwert :#ba55d3#ba55d3#ba55d3#ba55d3#ba55d3
Farbe :mediumorchid#c36dd9#c36dd9#9f48b4#9f48b4
HTML:#ba55d3#cd85df#cd85df#843c96#843c96
CSS:#ba55d3#d79de5#d79de5#6a3078#6a3078
CSS (Wert):#ba55d3#e1b6ec#e1b6ec#4f245a#4f245a
CSS (kürzest):#ba55d3#ebcef2#ebcef2#35183c#35183c
CSS (RGB):rgb(186,85,211)#f5e6f8#f5e6f8#1a0c1e#1a0c1e
CSS (%RGB):rgb(72%,33%,82%)#ffffff#ffffff#000000#000000

Beispiele zu Kombinationen mit Farbwert #ba55d3

Farbige Unterstreichung bei Befehl a

Einen Link setzen Sie mit Tag <a>. Diesen können Sie hervorheben und farblich gestalten.

Beispielsweise unterstreichen wir <a> mit einem einfallenden Rahmen mit 5 Pixel Dicke in Farbwert #ba55d3. Das ist mit HTML so kaum möglich. Deshalb formatieren wir hier mit CSS.

<style type="text/css"><!--
  a { 
    border-bottom-color: #ba55d3; 
    border-bottom-width: 5px; 
    border-bottom-style: inset;
  }
//-->
</style>

Die Idee ist dabei, unabhängige Formatierungen für Inhalt und Unterstreichung zu nutzen. Öfter sehen Sie diesen Effekt 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 hat keine Unterstreichung. Sie wird mit einem Rahmen simuliert und ist unabhängig vom Text.

Mehr zum Thema a können Sie in Verweise und Protokolle in HTML lesen. Einzelheiten vom hier verwendeten HTML-Tag a sind in der HTML Referenz bei <a> ausführlich gezeigt.

Umrandung mit Befehl img

In diesem Beispiel umranden wir <img> mit einem 1 Pixel dicken, gefurchten Rahmen in Farbwert #ba55d3. Dies ist mit HTML so kaum möglich. Wir nutzen deshalb CSS zur Formatierung.

<style type="text/css"><!--
  img { border:1px groove #ba55d3; }
//-->
</style>

Weiteres zum Thema img können Sie in Grafik in HTML nachsehen. Möglichkeiten vom Tag img erfahren Sie in der HTML Referenz unter <img>.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen