Ressourcen: 120 HTML Farbnamen - Kombination von Farbwert #ffdab9 und Farbwert #fffaf0

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 #ffdab9			Schriftfarbwert #fffaf0
Detail	:	Hintergrund #ffdab9	Detail	:	Schrift #fffaf0
Farbwert	:	#ffdab9	Farbwert	:	#fffaf0
Farbe	:	peachpuff	Farbe	:	floralwhite
HTML	:	#ffdab9	HTML	:	#fffaf0
HTML (Wert)	:	#ffdab9	HTML (Wert)	:	#fffaf0
CSS	:	#ffdab9	CSS	:	#fffaf0
CSS (Wert)	:	#ffdab9	CSS (Wert)	:	#fffaf0
CSS (kürzest)	:	#ffdab9	CSS (kürzest)	:	#fffaf0
CSS (RGB)	:	rgb(255,218,185)	CSS (RGB)	:	rgb(255,250,240)
CSS (%RGB)	:	rgb(100%,85%,72%)	CSS (%RGB)	:	rgb(100%,98%,94%)

Verlauf Hintergrundfarbwert #ffdab9 nach Schriftfarbwert #fffaf0
#ffdab9	#ffdec0	#ffe3c8	#ffe7d0	#ffecd8	#fff0e0	#fff5e8	#fffaf0
#ffdab9	#ffdec0	#ffe3c8	#ffe7d0	#ffecd8	#fff0e0	#fff5e8	#fffaf0

Kombination von #ffdab9 und #fffaf0
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 id velit ante. Cras vestibulum tristique erat, ac interdum justo cursus in.				Auf Hintergrund #ffdab9 ist #fffaf0 ungeeignet, da sowohl Helligkeit als auch die Farben zu ähnlich sind. Die Ähnlichkeit der Farben #fffaf0 und #ffdab9 beträgt 93.99%. Die Lesbarkeit dieser Farbkombination ergibt sich zu 6.01%.

Hintergrundfarbwert #ffdab9				Schriftfarbwert #fffaf0
Verlauf nach Weiß		Verlauf nach Schwarz		Verlauf nach Weiß		Verlauf nach Schwarz
#ffdab9	#ffdab9	#ffdab9	#ffdab9	#fffaf0	#fffaf0	#fffaf0	#fffaf0
#ffdfc3	#ffdfc3	#daba9e	#daba9e	#fffaf2	#fffaf2	#dad6cd	#dad6cd
#ffe4cd	#ffe4cd	#b69b84	#b69b84	#fffbf4	#fffbf4	#b6b2ab	#b6b2ab
#ffe9d7	#ffe9d7	#917c69	#917c69	#fffcf6	#fffcf6	#918e89	#918e89
#ffefe1	#ffefe1	#6d5d4f	#6d5d4f	#fffcf8	#fffcf8	#6d6b66	#6d6b66
#fff4eb	#fff4eb	#483e34	#483e34	#fffdfa	#fffdfa	#484744	#484744
#fff9f5	#fff9f5	#241f1a	#241f1a	#fffefc	#fffefc	#242322	#242322
#ffffff	#ffffff	#000000	#000000	#ffffff	#ffffff	#000000	#000000

Beispiele zur Kombination von Farbwert #ffdab9 und Farbwert #fffaf0

Wechsel der Hintergrundfarbe bei Hover bei Befehl kbd

Die Hintergrundfarbe soll sich von Farbwert #ffdab9 auf Farbwert #fffaf0 ändern, wenn man mit der Maus auf <kbd> zeigt. Wir bereiten zunächst die Formatierung von <kbd> in Farbwert #ffdab9 vor.

Als Beispiel legen wir bei <kbd> die Hintergrundfarbe auf Farbwert #ffdab9 fest. Die Größe der Schrift setzen wir auf 124%:

<style type="text/css"><!--
  kbd { 
    font-size:124%; 
    background-color:#ffdab9;
  }
//-->
</style>

Nun fordern wir, dass sich bei Hover die Hintergrundfarbe auf #fffaf0 ändert.

<style type="text/css"><!--
  kbd: hover { 
    background-color: #fffaf0;
  }
//-->
</style>

Mehr zum Thema lesen Sie in Text in HTML. Einzelheiten vom hier genutzten Befehl kbd sind in der HTML Referenz bei <kbd> zusammengestellt.

Text- und Unterstreichungsfarben mit HTML-Tag a

Einen Link setzen Sie mit HTML-Befehl <a>. Dieser kann hervorgehoben und farblich gestaltet werden.

Wir ändern für dieses Beispiel die Textfarbe von <a> auf Farbwert #fffaf0. Die Schriftart ändern wir auf sans-serif. Die Schriftgröße setzen wir auf 14px. Wir unterstreichen den Inhalt von <a> mit Hilfe eines herausstehenden Rahmens mit 3 Punkte Dicke in Farbwert #ffdab9. In HTML geht das nicht. Wir verwenden daher CSS zur Formatierung.

<style type="text/css"><!--
  a { 
    color:#fffaf0; 
    border-bottom-color:#ffdab9; 
    border-bottom-width:3pt; 
    border-bottom-style:outset; 
    font-family:sans-serif; 
    font-size:14px;
  }
//-->
</style>

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

Mehr zu a können Sie in Verweise und Protokolle in HTML nachlesen. Möglichkeiten des hier verwendeten Befehl a erfahren Sie in der HTML Referenz unter <a>.