Ressourcen: 120 HTML Farbnamen - Kombination von Farbe beige und Farbwert #483d8b

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.

Hintergrundfarbe beige

Schriftfarbwert #483d8b

DetailHintergrund beige DetailSchrift #483d8b 
Farbe :beigeFarbwert :#483d8b
Farbwert :#f5f5dcFarbe :darkslateblue
HTML:beigeHTML:#483d8b
HTML (Wert):#f5f5dcHTML (Wert):#483d8b
CSS:beigeCSS:#483d8b
CSS (Wert):#f5f5dcCSS (Wert):#483d8b
CSS (kürzest):#f5f5dcCSS (kürzest):#483d8b
CSS (RGB):rgb(245,245,220)CSS (RGB):rgb(72,61,139)
CSS (%RGB):rgb(96%,96%,86%)CSS (%RGB):rgb(28%,23%,54%)

Verlauf Hintergrundfarbe beige nach Schriftfarbwert #483d8b

#f5f5dc#dcdad0#c3c0c4#aaa6b9#928bad#7971a2#605796#483d8b
#f5f5dc#dcdad0#c3c0c4#aaa6b9#928bad#7971a2#605796#483d8b

Kombination von beige und #483d8b

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

#483d8b ist nicht als Schriftfarbe auf Hintergrund beige geeignet. Zwar ist der Helligkeitsunterschied in Ordnung, doch die Farben selbst sind zu ähnlich.

Die Ähnlichkeit von #483d8b und beige beträgt 60.98%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 39.02%.

Hintergrundfarbe beige

Schriftfarbwert #483d8b

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#f5f5dc#f5f5dc#f5f5dc#f5f5dc#483d8b#483d8b#483d8b#483d8b
#f6f6e1#f6f6e1#d2d2bc#d2d2bc#62589b#62589b#3d3477#3d3477
#f7f7e6#f7f7e6#afaf9d#afaf9d#7c74ac#7c74ac#332b63#332b63
#f9f9eb#f9f9eb#8c8c7d#8c8c7d#9690bc#9690bc#29224f#29224f
#fafaf0#fafaf0#69695e#69695e#b0abcd#b0abcd#1e1a3b#1e1a3b
#fcfcf5#fcfcf5#46463e#46463e#cac7dd#cac7dd#141127#141127
#fdfdfa#fdfdfa#23231f#23231f#e4e3ee#e4e3ee#0a0813#0a0813
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe beige und Farbwert #483d8b

Hintergrund/Text-Kombination mit HTML-Befehl p

Hier ändern wir die Textfarbe von <p> auf Farbwert #483d8b und die Hintergrundfarbe von <p> auf Farbe beige. Als Schriftart setzen wir verdana und setzen die Schriftgröße auf 13px.

<style type="text/css"><!--
  p { 
    font-family:verdana; 
    font-size:13px; 
    background-color:beige; 
    color:#483d8b;
  }
//-->
</style>

Weiteres zu p finden Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten des hier verwendeten Befehl p lesen Sie in der HTML Referenz unter <p>.

Wechsel der Hintergrundfarbe bei Hover bei Tag center

Die Hintergrundfarbe soll sich von Farbe beige auf Farbwert #483d8b ändern, wenn man mit der Maus darauf zeigt. Wir bereiten zunächst eine Darstellung von <center> in Farbe beige vor.

Hier legen wir Farbe beige als Hintergrundfarbe von <center> fest. Zwar ändern wir die Textfarbe nicht, setzen jedoch die Schriftart auf sans-serif und vergrößern die Größe der Schrift auf 123%:

<style type="text/css"><!--
  center { 
    font-size: 123%; 
    font-family: sans-serif; 
    background-color: beige;
  }
//-->
</style>
Nun stellen wir ein, dass bei Mausberührung die Hintergrundfarbe auf #483d8b gesetzt wird.
<style type="text/css"><!--
  center:hover { 
    background-color:#483d8b;
  }
//-->
</style>

Mehr zu center erfahren Sie in Grundlegende Gestaltungselemente in HTML. Möglichkeiten vom hier genutzten HTML-Befehl center sind in der HTML Referenz unter <center> ausführlich gezeigt.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen