Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #00bfff und Farbwert #b0e0e6

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 #00bfff

Schriftfarbwert #b0e0e6

DetailHintergrund #00bfff DetailSchrift #b0e0e6 
Farbwert :#00bfffFarbwert :#b0e0e6
Farbe :deepskyblueFarbe :powderblue
HTML:#00bfffHTML:#b0e0e6
HTML (Wert):#00bfffHTML (Wert):#b0e0e6
CSS:#00bfffCSS:#b0e0e6
CSS (Wert):#00bfffCSS (Wert):#b0e0e6
CSS (kürzest):#00bfffCSS (kürzest):#b0e0e6
CSS (RGB):rgb(0,191,255)CSS (RGB):rgb(176,224,230)
CSS (%RGB):rgb(0%,74%,100%)CSS (%RGB):rgb(69%,87%,90%)

Verlauf Hintergrundfarbwert #00bfff nach Schriftfarbwert #b0e0e6

#00bfff#19c3fb#32c8f7#4bcdf4#64d1f0#7dd6ed#96dbe9#b0e0e6
#00bfff#19c3fb#32c8f7#4bcdf4#64d1f0#7dd6ed#96dbe9#b0e0e6

Kombination von #00bfff und #b0e0e6

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

Die Ähnlichkeit von #b0e0e6 und #00bfff beträgt 92.95%. Die Lesbarkeit dieser Farbkombination bewerte ich mit 7.05%.

Auf Hintergrund #00bfff ist #b0e0e6 ungeeignet, weil die Unterschiede in der Helligkeit und Farbe nicht ausreichend sind.

Hintergrundfarbwert #00bfff

Schriftfarbwert #b0e0e6

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#00bfff#00bfff#00bfff#00bfff#b0e0e6#b0e0e6#b0e0e6#b0e0e6
#24c8ff#24c8ff#00a3da#00a3da#bbe4e9#bbe4e9#96c0c5#96c0c5
#48d1ff#48d1ff#0088b6#0088b6#c6e8ed#c6e8ed#7da0a4#7da0a4
#6ddaff#6ddaff#006d91#006d91#d1edf0#d1edf0#648083#648083
#91e3ff#91e3ff#00516d#00516d#ddf1f4#ddf1f4#4b6062#4b6062
#b6ecff#b6ecff#003648#003648#e8f6f7#e8f6f7#324041#324041
#daf5ff#daf5ff#001b24#001b24#f3fafb#f3fafb#192020#192020
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #00bfff und Farbwert #b0e0e6

Füllen und Umranden mit Tag hr

Hier umranden wir <hr> mit einem . Die Hintergrundfarbe für <hr> setzen wir auf Farbwert #00bfff. Mit HTML ist das kaum möglich. Wir verwenden deshalb CSS.

<style type="text/css"><!--
  hr { border:1px outset #b0e0e6; background-color:#00bfff; }
//-->
</style>

Mehr zu hr können Sie in Grundlegende Gestaltungselemente in HTML nachsehen. Möglichkeiten des hier genutzten Befehl <hr>.

Wechsel der Hintergrundfarbe bei Hover bei Tag a

Ein Hyperlink wird mit HTML-Tag <a> gesetzt. Diesen können Sie hervorheben und farblich gestalten.

Die Hintergrundfarbe soll sich von Farbwert #00bfff auf Farbwert #b0e0e6 ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Darstellung von <a> in Farbwert #00bfff vor.

Als Beispiel legen wir Farbwert #00bfff als Hintergrundfarbe von <a> fest. Zwar lassen wir die Textfarbe unverändert, setzen jedoch die Schriftart auf arial. Die Schriftgröße vergrößern wir auf 121%:

<style type="text/css"><!--
  a { 
    background-color: #00bfff; 
    font-family: arial; 
    font-size: 121%;
  }
//-->
</style>
Jetzt fordern wir, dass sich bei Mausberührung die Hintergrundfarbe auf #b0e0e6 ändert.
<style type="text/css"><!--
  a:hover { 
    background-color:#b0e0e6;
  }
//-->
</style>

Mehr zum Thema a können Sie in Verweise und Protokolle in HTML nachlesen. Weiteres zum hier gezeigten HTML-Befehl a finden Sie in der HTML Referenz unter <a>.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen