Ressourcen: 120 HTML Farbnamen - Kombination von Farbe turquoise und Farbwert #f0f8ff

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 turquoise

Schriftfarbwert #f0f8ff

DetailHintergrund turquoise DetailSchrift #f0f8ff 
Farbe :turquoiseFarbwert :#f0f8ff
Farbwert :#40e0d0Farbe :aliceblue
HTML:turquoiseHTML:#f0f8ff
HTML (Wert):#40e0d0HTML (Wert):#f0f8ff
CSS:turquoiseCSS:#f0f8ff
CSS (Wert):#40e0d0CSS (Wert):#f0f8ff
CSS (kürzest):#40e0d0CSS (kürzest):#f0f8ff
CSS (RGB):rgb(64,224,208)CSS (RGB):rgb(240,248,255)
CSS (%RGB):rgb(25%,87%,81%)CSS (%RGB):rgb(94%,97%,100%)

Verlauf Hintergrundfarbe turquoise nach Schriftfarbwert #f0f8ff

#40e0d0#59e3d6#72e6dd#8beae4#a4edea#bdf1f1#d6f4f8#f0f8ff
#40e0d0#59e3d6#72e6dd#8beae4#a4edea#bdf1f1#d6f4f8#f0f8ff

Kombination von turquoise und #f0f8ff

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

Die Ähnlichkeit von #f0f8ff und turquoise ergibt sich zu 92.71%. Die Lesbarkeit dieser Kombination von Farben bewerte ich mit 7.29%.

#f0f8ff eignet sich nicht als Schriftfarbe auf Hintergrund turquoise, da die Unterschiede in der Helligkeit und Farbe nicht ausreichend sind.

Hintergrundfarbe turquoise

Schriftfarbwert #f0f8ff

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#40e0d0#40e0d0#40e0d0#40e0d0#f0f8ff#f0f8ff#f0f8ff#f0f8ff
#5be4d6#5be4d6#36c0b2#36c0b2#f2f9ff#f2f9ff#cdd4da#cdd4da
#76e8dd#76e8dd#2da094#2da094#f4faff#f4faff#abb1b6#abb1b6
#91ede4#91ede4#248076#248076#f6fbff#f6fbff#898d91#898d91
#adf1ea#adf1ea#1b6059#1b6059#f8fcff#f8fcff#666a6d#666a6d
#c8f6f1#c8f6f1#12403b#12403b#fafdff#fafdff#444648#444648
#e3faf8#e3faf8#09201d#09201d#fcfeff#fcfeff#222324#222324
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe turquoise und Farbwert #f0f8ff

Text- und Unterstreichungsfarben mit Tag h5

Eine Überschrift der 5. Stufe erzeugen Sie mit Tag <h5>. Diese können Sie hervorheben und farblich gestalten.

Wir ändern in diesem Beispiel die Textfarbe von <h5> auf Farbwert #f0f8ff. Die Schriftart ändern wir auf verdana. Die Schriftgröße ändern wir auf 9pt. Wir unterstreichen den Inhalt von <h5> mit Hilfe eines gepunkteten Rahmens mit 3 Punkte Dicke in Farbe turquoise. Das ist in HTML so kaum möglich. Wir nutzen daher CSS.

<style type="text/css"><!--
  h5 { 
    font-size: 9pt; 
    font-family: verdana; 
    color: #f0f8ff; 
    border-bottom: 3pt dotted turquoise;
  }
//-->
</style>

Die Idee ist, unterschiedliche Formatierungen für Inhalt und Unterstreichung zu haben.

Mehr zum Thema h5 erfahren Sie in Grundlegende Gestaltungselemente in HTML. Der hier verwendete Tag h5 ist in der HTML Referenz bei <h5> genau zusammengestellt.

Wechsel der Textfarbe bei Hover bei HTML-Tag h6

Eine Überschrift setzt man mit Tag <h6>. Sie kann farblich gestaltet und hervorgehoben werden.

Die Textfarbe soll sich von Farbe turquoise auf Farbwert #f0f8ff ändern, wenn man mit der Maus darauf zeigt. Bereiten wir zunächst die Formatierung von <h6> in Farbe turquoise vor.

Wir legen als Beispiel Farbe turquoise als Textfarbe von <h6> fest. Zwar verändern wir die Hintergrundfarbe nicht, setzen jedoch die Schriftart auf arial und verkleinern die Schriftgröße auf 92%.

<style type="text/css"><!--
  h6 { 
    color: turquoise; 
    font-size: 92%; 
    font-family: arial;
  }
//-->
</style>
Jetzt fordern wir, dass bei Hover die Textfarbe auf #f0f8ff gesetzt wird.
<style type="text/css"><!--
  h6:hover { 
    color:#f0f8ff;
  }
//-->
</style>

Mehr zu h6 erfahren Sie in Grundlegende Gestaltungselemente in HTML. Weiteres zum Befehl <h6>.

Tabelle der 120 HTML Farbnamen

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

Weitere Farbtabellen