Ressourcen: 137 HTML Farbnamen - Kombination von Farbe teal und Farbwert #f5fffa

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, einem bestimmten Schema folgenden, Farbwerten, definierte man noch 120 Werte und ordnete ihnen Namen zu. Zusammen mit den 17 Standard-HTML-Farben, die ebenfalls Namen haben, ergeben sich so 137 HTML Farbnamen.

Hintergrundfarbe teal

Schriftfarbwert #f5fffa

DetailHintergrund teal DetailSchrift #f5fffa 
Farbe :tealFarbwert :#f5fffa
Farbwert :#008080Farbe :mintcream
HTML:tealHTML:#f5fffa
HTML (Wert):#008080HTML (Wert):#f5fffa
CSS:tealCSS:#f5fffa
CSS (Wert):#008080CSS (Wert):#f5fffa
CSS (kürzest):#008080CSS (kürzest):#f5fffa
CSS (RGB):rgb(0,128,128)CSS (RGB):rgb(245,255,250)
CSS (%RGB):rgb(0%,50%,50%)CSS (%RGB):rgb(96%,100%,98%)

Verlauf Hintergrundfarbe teal nach Schriftfarbwert #f5fffa

#008080#239291#46a4a2#69b6b4#8cc8c5#afdad7#d2ece8#f5fffa
#008080#239291#46a4a2#69b6b4#8cc8c5#afdad7#d2ece8#f5fffa

Kombination von teal und #f5fffa

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

#f5fffa ist nicht als Schriftfarbe auf Hintergrund teal geeignet. Zwar ist der Helligkeitsunterschied gross genug, doch die Farben selbst sind zu ähnlich.

Die Ähnlichkeit der Farben #f5fffa und teal ergibt sich zu 77.74%. Die Lesbarkeit dieser Kombination von Farben ergibt sich zu 22.26%.

Hintergrundfarbe teal

Schriftfarbwert #f5fffa

Verlauf nach WeißVerlauf nach SchwarzVerlauf nach WeißVerlauf nach Schwarz
#008080#008080#008080#008080#f5fffa#f5fffa#f5fffa#f5fffa
#249292#249292#006d6d#006d6d#f6fffa#f6fffa#d2dad6#d2dad6
#48a4a4#48a4a4#005b5b#005b5b#f7fffb#f7fffb#afb6b2#afb6b2
#6db6b6#6db6b6#004949#004949#f9fffc#f9fffc#8c918e#8c918e
#91c8c8#91c8c8#003636#003636#fafffc#fafffc#696d6b#696d6b
#b6dada#b6dada#002424#002424#fcfffd#fcfffd#464847#464847
#daecec#daecec#001212#001212#fdfffe#fdfffe#232423#232423
#ffffff#ffffff#000000#000000#ffffff#ffffff#000000#000000

Beispiele zur Kombination von Farbe teal und Farbwert #f5fffa

Wechsel der Umrandung bei Hover bei Tag dt

Die Rahmenfarbe soll sich von Farbe teal auf Farbwert #f5fffa ändern, wenn man mit der Maus auf <dt> zeigt. Bereiten wir zunächst die Formatierung von <dt> in Farbe teal vor.

In diesem Beispiel umranden wir <dt> mit einem 5 Pixel dicken, gefurchten Rahmen in Farbe teal.

<style type="text/css"><!--
  dt { border:5px groove teal; }
//-->
</style>
Jetzt fordern wir, dass sich bei Berührung mit der Maus die Rahmenfarbe zu #f5fffa ändert.
<style type="text/css"><!--
  dt:hover { 
    border-color:#f5fffa;
  }
//-->
</style>

Mehr zu dt finden Sie in Listen und Glossare in HTML. Weiteres zum hier genutzten Tag <dt>.

Zebra-Effekt von HTML-Befehl th

Man redet von einem Zebra-Effekt, wenn zwei Farben abweselnd als Hintergrundfarbe verwendet werden. Er unterstützt das Auge, etwa die Zeile oder Spalte nicht zu verlieren. Wir definieren zwei Klassen .yang und .ying für <th> mit unterschiedlichen Hintergrundfarben Farbe teal und Farbwert #f5fffa.

<style type="text/css"><!--
  th.yang { 
    background-color: teal;
  }
  th.ying { 
    background-color: #f5fffa;
  }
//-->
</style>

Diese CSS-Klassen werden dann abwechselnd genutzt.

<table>
<tr><td class="yang">K1:1</td><td class="ying">K2:1</td><td class="yang">K3:1</td></tr>
<tr><td class="yang">K1:2</td><td class="ying">K2:2</td><td class="yang">K3:2</td></tr>
<tr><td class="yang">K1:3</td><td class="ying">K2:3</td><td class="yang">K3:3</td></tr>
</table>

Mehr zum Thema th können Sie in Tabellen in HTML erfahren. Weiteres zum hier genutzten Befehl th finden Sie in der HTML Referenz unter <th>.

Tabelle der 137 HTML Farbnamen

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

Weitere Farbtabellen