Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ffa07a und Farbe lightgreen

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

Schriftfarbe lightgreen

DetailHintergrund #ffa07a DetailSchrift lightgreen 
Farbwert :#ffa07aFarbe :lightgreen
Farbe :lightsalmonFarbwert :#90ee90
HTML:#ffa07aHTML:lightgreen
HTML (Wert):#ffa07aHTML (Wert):#90ee90
CSS:#ffa07aCSS:lightgreen
CSS (Wert):#ffa07aCSS (Wert):#90ee90
CSS (kürzest):#ffa07aCSS (kürzest):#90ee90
CSS (RGB):rgb(255,160,122)CSS (RGB):rgb(144,238,144)
CSS (%RGB):rgb(100%,62%,47%)CSS (%RGB):rgb(56%,93%,56%)

Verlauf Hintergrundfarbwert #ffa07a nach Schriftfarbe lightgreen

#ffa07a#efab7d#dfb680#cfc183#bfcc86#afd789#9fe28c#90ee90
#ffa07a#efab7d#dfb680#cfc183#bfcc86#afd789#9fe28c#90ee90

Kombination von #ffa07a und lightgreen

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

Die Ähnlichkeit von lightgreen und #ffa07a ergibt sich zu 93.32%. Die Lesbarkeit dieser Kombination liegt damit bei 6.68%.

lightgreen ist nicht als Schriftfarbe auf Hintergrund #ffa07a geeignet. Die Unterschiede in der Helligkeit und Farbe sind unzureichend.

Hintergrundfarbwert #ffa07a

Schriftfarbe lightgreen

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#ffa07a#ffa07a#ffa07a#ffa07a#90ee90#90ee90#90ee90#90ee90
#ffad8d#ffad8d#da8968#da8968#9ff09f#9ff09f#7bcc7b#7bcc7b
#ffbba0#ffbba0#b67257#b67257#aff2af#aff2af#66aa66#66aa66
#ffc8b3#ffc8b3#915b45#915b45#bff5bf#bff5bf#528852#528852
#ffd6c6#ffd6c6#6d4434#6d4434#cff7cf#cff7cf#3d663d#3d663d
#ffe3d9#ffe3d9#482d22#482d22#dffadf#dffadf#294429#294429
#fff1ec#fff1ec#241611#241611#effcef#effcef#142214#142214
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #ffa07a und Farbe lightgreen

Wechsel der Hintergrundfarbe bei Hover bei HTML-Tag p

Die Hintergrundfarbe soll sich von Farbwert #ffa07a auf Farbe lightgreen ändern, wenn man mit der Maus auf <p> zeigt. Wir bereiten zunächst die Darstellung von <p> in Farbwert #ffa07a vor.

Wir setzen in diesem Beispiel bei <p> die Hintergrundfarbe auf Farbwert #ffa07a und setzen die Größe der Schrift auf 86%.

<style type="text/css"><!--
  p { 
    background-color:#ffa07a; 
    font-size:86%;
  }
//-->
</style>
Jetzt stellen wir ein, dass sich bei Berührung mit der Maus die Hintergrundfarbe auf lightgreen ändert.
<style type="text/css"><!--
  p:hover { 
    background-color:lightgreen;
  }
//-->
</style>

Mehr zu p können Sie in Grundlegende Gestaltungselemente in HTML finden. Einzelheiten des HTML-Tag <p>.

Hintergrund/Text-Kombination von HTML-Tag h4

Eine Überschrift erzeugen Sie mit HTML-Befehl <h4>. Diese können Sie farblich gestalten.

Wir ändern hier die Textfarbe von <h4> auf Farbe lightgreen und die Hintergrundfarbe von <h4> auf Farbwert #ffa07a. Als Schriftart setzen wir sans-serif und ändern die Schriftgröße auf 13px.

<style type="text/css"><!--
  h4 { 
    color: lightgreen; 
    font-family: sans-serif; 
    font-size: 13px; 
    background-color: #ffa07a;
  }
//-->
</style>

Mehr zu h4 finden Sie in Grundlegende Gestaltungselemente in HTML. Mehr zum hier gezeigten Befehl h4 ist in der HTML Referenz unter <h4> ausführlich gezeigt.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen