Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #d2691e und Farbe lightcyan

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

Schriftfarbe lightcyan

DetailHintergrund #d2691e DetailSchrift lightcyan 
Farbwert :#d2691eFarbe :lightcyan
Farbe :chocolateFarbwert :#e0ffff
HTML:#d2691eHTML:lightcyan
HTML (Wert):#d2691eHTML (Wert):#e0ffff
CSS:#d2691eCSS:lightcyan
CSS (Wert):#d2691eCSS (Wert):#e0ffff
CSS (kürzest):#d2691eCSS (kürzest):#e0ffff
CSS (RGB):rgb(210,105,30)CSS (RGB):rgb(224,255,255)
CSS (%RGB):rgb(82%,41%,11%)CSS (%RGB):rgb(87%,100%,100%)

Verlauf Hintergrundfarbwert #d2691e nach Schriftfarbe lightcyan

#d2691e#d47e3e#d6935e#d8a97e#dabe9e#dcd4be#dee9de#e0ffff
#d2691e#d47e3e#d6935e#d8a97e#dabe9e#dcd4be#dee9de#e0ffff

Kombination von #d2691e und lightcyan

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. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse augue erat, auctor ut ultricies non, facilisis sed neque.

Die Ähnlichkeit der Farben lightcyan und #d2691e beträgt 83.59%. Die Lesbarkeit dieser Kombination ergibt sich zu 16.41%.

lightcyan eignet sich nicht als Schriftfarbe auf Hintergrund #d2691e. Die Unterschiede in der Helligkeit und Farbe sind zu gering.

Hintergrundfarbwert #d2691e

Schriftfarbe lightcyan

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#d2691e#d2691e#d2691e#d2691e#e0ffff#e0ffff#e0ffff#e0ffff
#d87e3e#d87e3e#b45a19#b45a19#e4ffff#e4ffff#c0dada#c0dada
#de935e#de935e#964b15#964b15#e8ffff#e8ffff#a0b6b6#a0b6b6
#e5a97e#e5a97e#783c11#783c11#edffff#edffff#809191#809191
#ebbe9e#ebbe9e#5a2d0c#5a2d0c#f1ffff#f1ffff#606d6d#606d6d
#f2d4be#f2d4be#3c1e08#3c1e08#f6ffff#f6ffff#404848#404848
#f8e9de#f8e9de#1e0f04#1e0f04#faffff#faffff#202424#202424
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #d2691e und Farbe lightcyan

Wechsel der Textfarbe bei Hover mit Tag s

Die Textfarbe soll sich von Farbwert #d2691e auf Farbe lightcyan ändern, wenn man mit der Maus auf <s> zeigt. Bereiten wir zunächst die Darstellung von <s> in Farbwert #d2691e vor.

Wir ändern zum Beispiel die Textfarbe von <s> auf Farbwert #d2691e. Die Schriftgröße setzen wir auf 13px.

<style type="text/css"><!--
  s { 
    color:#d2691e; 
    font-size:13px;
  }
//-->
</style>
Nun fordern wir, dass bei Berührung mit der Maus die Textfarbe auf lightcyan geändert wird.
<style type="text/css"><!--
  s: hover { 
    color: lightcyan;
  }
//-->
</style>

Mehr zum Thema finden Sie in Text in HTML. Zur Beschreibung vom hier verwendeten Tag <s>.

Zebra-Effekt mit HTML-Tag tr

Man redet vom Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe verwendet werden. Dieser Effekt unterstützt das Auge z.B. die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .ger und .ung für <tr> mit den Hintergrundfarben Farbwert #d2691e und Farbe lightcyan.

<style type="text/css"><!--
  tr.ger { 
    background-color:#d2691e;
  }
  tr.ung { 
    background-color: lightcyan;
  }
//-->
</style>

Diese CSS-Klassen werden abwechselnd genutzt.

<table>
<tr class="ger"><td>I1-1</td><td>I2-1</td><td>I3-1</td></tr>
<tr class="ung"><td>I1-2</td><td>I2-2</td><td>I3-2</td></tr>
<tr class="ger"><td>I1-3</td><td>I2-3</td><td>I3-3</td></tr>
</table>

Mehr zum Thema tr können Sie in Tabellen in HTML nachlesen. Einzelheiten vom hier gezeigten Tag tr erfahren Sie in der HTML Referenz unter <tr>.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen