Ressourcen: 120 HTML Farbnamen - Kombination von Farbe darkblue und Farbwert #20b2aa

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 darkblue

Schriftfarbwert #20b2aa

DetailHintergrund darkblue DetailSchrift #20b2aa 
Farbe :darkblueFarbwert :#20b2aa
Farbwert :#00008bFarbe :lightseagreen
HTML:darkblueHTML:#20b2aa
HTML (Wert):#00008bHTML (Wert):#20b2aa
CSS:darkblueCSS:#20b2aa
CSS (Wert):#00008bCSS (Wert):#20b2aa
CSS (kürzest):#00008bCSS (kürzest):#20b2aa
CSS (RGB):rgb(0,0,139)CSS (RGB):rgb(32,178,170)
CSS (%RGB):rgb(0%,0%,54%)CSS (%RGB):rgb(12%,69%,66%)

Verlauf Hintergrundfarbe darkblue nach Schriftfarbwert #20b2aa

#00008b#04198f#093293#0d4c98#12659c#167fa1#1b98a5#20b2aa
#00008b#04198f#093293#0d4c98#12659c#167fa1#1b98a5#20b2aa

Kombination von darkblue und #20b2aa

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

#20b2aa eignet sich nicht als Schriftfarbe auf Hintergrund darkblue, da sich die Helligkeit und Farben zu ähnlich sind.

Die Ähnlichkeit von #20b2aa und darkblue ergibt sich zu 72.22%. Die Lesbarkeit dieser Kombination ergibt sich zu 27.78%.

Hintergrundfarbe darkblue

Schriftfarbwert #20b2aa

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#00008b#00008b#00008b#00008b#20b2aa#20b2aa#20b2aa#20b2aa
#24249b#24249b#000077#000077#3fbdb6#3fbdb6#1b9891#1b9891
#4848ac#4848ac#000063#000063#5fc8c2#5fc8c2#167f79#167f79
#6d6dbc#6d6dbc#00004f#00004f#7fd3ce#7fd3ce#126561#126561
#9191cd#9191cd#00003b#00003b#9fdeda#9fdeda#0d4c48#0d4c48
#b6b6dd#b6b6dd#000027#000027#bfe9e6#bfe9e6#093230#093230
#dadaee#dadaee#000013#000013#dff4f2#dff4f2#041918#041918
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe darkblue und Farbwert #20b2aa

Hintergrund/Text-Kombination von Tag h1

Eine Überschrift der 1. Stufe wird mit Befehl <h1> gesetzt. Diese können Sie hervorheben und farblich gestalten.

Für dieses Beispiel ändern wir die Textfarbe von <h1> auf Farbwert #20b2aa und die Hintergrundfarbe von <h1> auf Farbe darkblue. Die Schriftart setzen wir auf sans-serif und ändern die Schriftgröße auf 10pt.

<style type="text/css"><!--
  h1 { 
    font-size:10pt; 
    color:#20b2aa; 
    background-color:darkblue; 
    font-family:sans-serif;
  }
//-->
</style>

Weiteres zu h1 können Sie in Grundlegende Gestaltungselemente in HTML erfahren. Der HTML-Tag h1 ist in der HTML Referenz bei <h1> genau beschrieben.

Füllen und Umranden von Tag ins

In diesem Beispiel umranden wir <ins> mit einem . Den Hintergrund von <ins> färben wir mit Farbe darkblue. In HTML ist das kaum möglich. Daher nutzen wir CSS.

<style type="text/css"><!--
  ins { border:2pt ridge #20b2aa; background-color:darkblue; }
//-->
</style>

Der Befehl ins ist in der HTML Referenz bei <ins> zusammengestellt.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen