Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ff1493 und Farbe ghostwhite

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

Schriftfarbe ghostwhite

DetailHintergrund #ff1493 DetailSchrift ghostwhite 
Farbwert :#ff1493Farbe :ghostwhite
Farbe :deeppinkFarbwert :#f8f8ff
HTML:#ff1493HTML:ghostwhite
HTML (Wert):#ff1493HTML (Wert):#f8f8ff
CSS:#ff1493CSS:ghostwhite
CSS (Wert):#ff1493CSS (Wert):#f8f8ff
CSS (kürzest):#ff1493CSS (kürzest):#f8f8ff
CSS (RGB):rgb(255,20,147)CSS (RGB):rgb(248,248,255)
CSS (%RGB):rgb(100%,7%,57%)CSS (%RGB):rgb(97%,97%,100%)

Verlauf Hintergrundfarbwert #ff1493 nach Schriftfarbe ghostwhite

#ff1493#fe34a2#fd55b1#fc75c1#fb96d0#fab6e0#f9d7ef#f8f8ff
#ff1493#fe34a2#fd55b1#fc75c1#fb96d0#fab6e0#f9d7ef#f8f8ff

Kombination von #ff1493 und ghostwhite

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.

Auf Hintergrund #ff1493 ist ghostwhite ungeeignet. Zwar ist der Helligkeitsunterschied in Ordnung, die Farben selbst sind jedoch zu ähnlich.

Die Ähnlichkeit von ghostwhite und #ff1493 ergibt sich zu 83.62%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 16.38%.

Hintergrundfarbwert #ff1493

Schriftfarbe ghostwhite

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#ff1493#ff1493#ff1493#ff1493#f8f8ff#f8f8ff#f8f8ff#f8f8ff
#ff35a2#ff35a2#da117e#da117e#f9f9ff#f9f9ff#d4d4da#d4d4da
#ff57b1#ff57b1#b60e69#b60e69#fafaff#fafaff#b1b1b6#b1b1b6
#ff78c1#ff78c1#910b54#910b54#fbfbff#fbfbff#8d8d91#8d8d91
#ff9ad0#ff9ad0#6d083f#6d083f#fcfcff#fcfcff#6a6a6d#6a6a6d
#ffbbe0#ffbbe0#48052a#48052a#fdfdff#fdfdff#464648#464648
#ffddef#ffddef#240215#240215#fefeff#fefeff#232324#232324
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbwert #ff1493 und Farbe ghostwhite

Wechsel der Textfarbe bei Hover von Befehl address

Die Textfarbe soll sich von Farbwert #ff1493 auf Farbe ghostwhite ändern, wenn man mit der Maus auf <address> zeigt. Bereiten wir zunächst eine Darstellung von <address> in Farbwert #ff1493 vor.

Für dieses Beispiel ändern wir die Textfarbe von <address> auf Farbwert #ff1493. Die Größe der Schrift verringern wir auf 99%.

<style type="text/css"><!--
  address { 
    font-size:99%; 
    color:#ff1493;
  }
//-->
</style>
Nun stellen wir ein, dass sich bei Mausberührung die Textfarbe zu ghostwhite ändert.
<style type="text/css"><!--
  address:hover { 
    color:ghostwhite;
  }
//-->
</style>

Weiteres zu address lesen Sie in Blockorientierte Elemente in HTML. Der Tag address ist in der HTML Referenz bei <address> genau gezeigt.

Füllen und Umranden bei HTML-Befehl em

In diesem Beispiel umranden wir <em> mit einem . Die Hintergrundfarbe für <em> färben wir entsprechend mit Farbwert #ff1493. In HTML geht das nicht. Daher nutzen wir hier CSS zur Formatierung.

<style type="text/css"><!--
  em { border:4px ridge ghostwhite; background-color:#ff1493; }
//-->
</style>

Mehr zum Thema em können Sie in Text in HTML erfahren. Einzelheiten vom Tag em sind in der HTML Referenz unter <em> ausführlich zusammengestellt.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen