Ressourcen: 120 HTML Farbnamen - Kombination von Farbe orangered und Farbe violet

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 orangered

Schriftfarbe violet

DetailHintergrund orangered DetailSchrift violet 
Farbe :orangeredFarbe :violet
Farbwert :#ff4500Farbwert :#ee82ee
HTML:orangeredHTML:violet
HTML (Wert):#ff4500HTML (Wert):#ee82ee
CSS:orangeredCSS:violet
CSS (Wert):#ff4500CSS (Wert):#ee82ee
CSS (kürzest):#ff4500CSS (kürzest):#ee82ee
CSS (RGB):rgb(255,69,0)CSS (RGB):rgb(238,130,238)
CSS (%RGB):rgb(100%,27%,0%)CSS (%RGB):rgb(93%,50%,93%)

Verlauf Hintergrundfarbe orangered nach Schriftfarbe violet

#ff4500#fc4d22#fa5644#f75f66#f56788#f270aa#f079cc#ee82ee
#ff4500#fc4d22#fa5644#f75f66#f56788#f270aa#f079cc#ee82ee

Kombination von orangered und violet

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

Die Ähnlichkeit der Farben violet und orangered ergibt sich zu 92.93%. Die Lesbarkeit dieser Kombination von Farben liegt damit bei 7.07%.

violet ist nicht als Schriftfarbe auf Hintergrund orangered geeignet, da weder der Helligkeitsunterschied noch der Farbunterschied ausreichend sind.

Hintergrundfarbe orangered

Schriftfarbe violet

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#ff4500#ff4500#ff4500#ff4500#ee82ee#ee82ee#ee82ee#ee82ee
#ff5f24#ff5f24#da3b00#da3b00#f093f0#f093f0#cc6fcc#cc6fcc
#ff7a48#ff7a48#b63100#b63100#f2a5f2#f2a5f2#aa5caa#aa5caa
#ff946d#ff946d#912700#912700#f5b7f5#f5b7f5#884a88#884a88
#ffaf91#ffaf91#6d1d00#6d1d00#f7c9f7#f7c9f7#663766#663766
#ffc9b6#ffc9b6#481300#481300#fadbfa#fadbfa#442544#442544
#ffe4da#ffe4da#240900#240900#fcedfc#fcedfc#221222#221222
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe orangered und Farbe violet

Hintergrund/Text-Kombination bei Tag a

Mit Tag <a> erzeugen Sie einen Link. Dieser kann farblich gestaltet und hervorgehoben werden.

Wir ändern bei diesem Beispiel die Textfarbe von <a> auf Farbe violet und die Hintergrundfarbe von <a> auf Farbe orangered. Als Schriftart wählen wir sans-serif und setzen die Schriftgröße auf 13px.

<style type="text/css"><!--
  a { 
    font-family:sans-serif; 
    color:violet; 
    font-size:13px; 
    background-color:orangered;
  }
//-->
</style>

Mehr zum Thema a können Sie in Verweise und Protokolle in HTML erfahren. Der Befehl a ist in der HTML Referenz bei <a> gezeigt.

Wechsel der Hintergrundfarbe bei Hover von Tag center

Die Hintergrundfarbe soll sich von Farbe orangered auf Farbe violet ändern, wenn man mit der Maus auf <center> zeigt. Wir bereiten zunächst eine Formatierung von <center> in Farbe orangered vor.

Wir setzen z.B. die Hintergrundfarbe von <center> auf Farbe orangered.

<style type="text/css"><!--
  center { 
    background-color: orangered;
  }
//-->
</style>
Nun fordern wir, dass bei Berührung mit der Maus die Hintergrundfarbe auf violet gesetzt wird.
<style type="text/css"><!--
  center: hover { 
    background-color: violet;
  }
//-->
</style>

Weiteres zum Thema erfahren Sie in Grundlegende Gestaltungselemente in HTML. Der Tag center ist in der HTML Referenz unter <center> ausführlich beschrieben.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen