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

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 cadetblue

Schriftfarbe orangered

DetailHintergrund cadetblue DetailSchrift orangered 
Farbe :cadetblueFarbe :orangered
Farbwert :#5f9ea0Farbwert :#ff4500
HTML:cadetblueHTML:orangered
HTML (Wert):#5f9ea0HTML (Wert):#ff4500
CSS:cadetblueCSS:orangered
CSS (Wert):#5f9ea0CSS (Wert):#ff4500
CSS (kürzest):#5f9ea0CSS (kürzest):#ff4500
CSS (RGB):rgb(95,158,160)CSS (RGB):rgb(255,69,0)
CSS (%RGB):rgb(37%,61%,62%)CSS (%RGB):rgb(100%,27%,0%)

Verlauf Hintergrundfarbe cadetblue nach Schriftfarbe orangered

#5f9ea0#759189#8c8472#a3775b#ba6b44#d15e2d#e85116#ff4500
#5f9ea0#759189#8c8472#a3775b#ba6b44#d15e2d#e85116#ff4500

Kombination von cadetblue und orangered

Lorem ipsum dolor sit amet, consectetur adipiscing elit. 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. Cras vestibulum tristique erat, ac interdum justo cursus in. Cras id velit ante.

Die Ähnlichkeit der Farben orangered und cadetblue ergibt sich zu 94.63%. Die Lesbarkeit dieser Kombination liegt damit bei 5.37%.

Auf Hintergrund cadetblue ist orangered ungeeignet, weil sich sowohl Helligkeit als auch die Farben zu ähnlich sind.

Hintergrundfarbe cadetblue

Schriftfarbe orangered

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#5f9ea0#5f9ea0#5f9ea0#5f9ea0#ff4500#ff4500#ff4500#ff4500
#75abad#75abad#518789#518789#ff5f24#ff5f24#da3b00#da3b00
#8cb9bb#8cb9bb#437072#437072#ff7a48#ff7a48#b63100#b63100
#a3c7c8#a3c7c8#365a5b#365a5b#ff946d#ff946d#912700#912700
#bad5d6#bad5d6#284344#284344#ffaf91#ffaf91#6d1d00#6d1d00
#d1e3e3#d1e3e3#1b2d2d#1b2d2d#ffc9b6#ffc9b6#481300#481300
#e8f1f1#e8f1f1#0d1616#0d1616#ffe4da#ffe4da#240900#240900
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiel zur Kombination von Farbe cadetblue und Farbe orangered

Wechsel der Umrandung bei Hover bei Tag h5

Mit HTML-Befehl <h5> wird eine Überschrift gesetzt. Diese kann farblich gestaltet werden.

Die Rahmenfarbe soll sich von Farbe cadetblue auf Farbe orangered ändern, wenn man mit der Maus auf <h5> zeigt. Bereiten wir zunächst die Darstellung von <h5> in Farbe cadetblue vor.

In diesem Beispiel umranden wir <h5> mit einem 5 Pixel dicken, doppelten Rahmen in Farbe cadetblue.

<style type="text/css"><!--
  h5 { 
    border-style: double; 
    border-color: cadetblue; 
    border-width: 5px;
  }
//-->
</style>
Jetzt stellen wir ein, dass sich bei Mausberührung die Rahmenfarbe zu orangered ändert.
<style type="text/css"><!--
  h5:hover { 
    border-color:orangered;
  }
//-->
</style>

Mehr zu h5 lesen Sie in Grundlegende Gestaltungselemente in HTML. Mehr zum hier genutzten Tag h5 ist in der HTML Referenz unter <h5> gezeigt.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen