Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #b0c4de und Farbe mediumspringgreen

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

Schriftfarbe mediumspringgreen

DetailHintergrund #b0c4de DetailSchrift mediumspringgreen 
Farbwert :#b0c4deFarbe :mediumspringgreen
Farbe :lightsteelblueFarbwert :#00fa9a
HTML:#b0c4deHTML:mediumspringgreen
HTML (Wert):#b0c4deHTML (Wert):#00fa9a
CSS:#b0c4deCSS:mediumspringgreen
CSS (Wert):#b0c4deCSS (Wert):#00fa9a
CSS (kürzest):#b0c4deCSS (kürzest):#00fa9a
CSS (RGB):rgb(176,196,222)CSS (RGB):rgb(0,250,154)
CSS (%RGB):rgb(69%,76%,87%)CSS (%RGB):rgb(0%,98%,60%)

Verlauf Hintergrundfarbwert #b0c4de nach Schriftfarbe mediumspringgreen

#b0c4de#96cbd4#7dd3ca#64dbc0#4be2b7#32eaad#19f2a3#00fa9a
#b0c4de#96cbd4#7dd3ca#64dbc0#4be2b7#32eaad#19f2a3#00fa9a

Kombination von #b0c4de und mediumspringgreen

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

Die Ähnlichkeit der Farben mediumspringgreen und #b0c4de ergibt sich zu 93.89%. Die Lesbarkeit dieser Kombination ergibt sich zu 6.11%.

mediumspringgreen eignet sich nicht als Schriftfarbe auf Hintergrund #b0c4de, da sich sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbwert #b0c4de

Schriftfarbe mediumspringgreen

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#b0c4de#b0c4de#b0c4de#b0c4de#00fa9a#00fa9a#00fa9a#00fa9a
#bbcce2#bbcce2#96a8be#96a8be#24faa8#24faa8#00d684#00d684
#c6d4e7#c6d4e7#7d8c9e#7d8c9e#48fbb6#48fbb6#00b26e#00b26e
#d1ddec#d1ddec#64707e#64707e#6dfcc5#6dfcc5#008e58#008e58
#dde5f0#dde5f0#4b545f#4b545f#91fcd3#91fcd3#006b42#006b42
#e8eef5#e8eef5#32383f#32383f#b6fde2#b6fde2#00472c#00472c
#f3f6fa#f3f6fa#191c1f#191c1f#dafef0#dafef0#002316#002316
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiel zur Kombination von Farbwert #b0c4de und Farbe mediumspringgreen

Wechsel der Hintergrundfarbe bei Hover von HTML-Befehl pre

Die Hintergrundfarbe soll sich von Farbwert #b0c4de auf Farbe mediumspringgreen ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <pre> in Farbwert #b0c4de vor.

Für dieses Beispiel legen wir die Hintergrundfarbe von <pre> auf Farbwert #b0c4de fest. Die Größe der Schrift setzen wir auf 10px.

<style type="text/css"><!--
  pre { 
    background-color:#b0c4de; 
    font-size:10px;
  }
//-->
</style>
Nun stellen wir ein, dass bei Mausberührung die Hintergrundfarbe auf mediumspringgreen geändert wird.
<style type="text/css"><!--
  pre:hover { 
    background-color:mediumspringgreen;
  }
//-->
</style>

Mehr zum Thema können Sie in Blockorientierte Elemente in HTML nachlesen. Möglichkeiten des HTML-Tag <pre>.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen