Hilfe:SELFHTML-Farbtabelle

Aus SELFHTML-Wiki
(Weitergeleitet von Hilfe:Farben)
Wechseln zu: Navigation, Suche

Die SELFHTML-Farbtabelle ist die Ausgangslage für das Erscheinungsbild von SELFHTML.

Farbe Farbwert Verwendung Beispiel Kontrast
dunkelgrau #333333
hsl(0, 0%, 20%)
Schriften, allgemein Schriften, allgemein 12.63:1
gelb #dfac20
hsl(44, 75%, 50%)
selfhtml-Logo, Quelltextbeispiele background-color: #dfac20; color:white; 2.09:1
lichtes gelb #fdfcf3
hsl(54, 71%, 97%)
Hintergrundfarbe für BeispielCode, Forums-Posting background-color: #fdfcf3; border: #e7c157 6.05:1
grün #8db243
hsl(80, 45%, 48%)
Suche auf Startseite, Hinweis, Empfehlung background-color: #8db243; color:white; 2.45:1
lichtes grün #ebf5d7
hsl(80, 60%, 90%)
background-color: #ebf5d7; border: #8db243 5.16:1
rot #c32e04
hsl(13, 96%, 39%)
Achtung, Beachten, Löschen background-color: #c32e04; color:white; 5.66:1
lichtes rot #ffebe6
hsl(12, 100%, 95%)
background-color: #ffebe6; border: #c32e04 11.00:1
blau #3983ab
hsl(201, 50%, 45%)
selfhtml-Logo, ToDo, Fortsetzung 4.19:1
lichtes blau #e6f2f7
hsl(198, 52%, 94%)
background-color: #e6f2f7; border: #3983ab 11.08:1
grau #bfbfbf
hsl(0, 0%, 75%)
selfhtml-Logo, spitze Klammern <!selfhtml/> [1.84:1]
lichtes grau #f1f3f4
hsl(200, 12%, 95%)
Hintergrund für Sidebar, Inhaltsverzeichnis background-color: #f1f3f4; border: #adadad 11.35:1
dunkles blaugrau #5d7380
hsl(202, 16%, 43%)
.autor a (Forum) 4.97:1
blaugrau #8a9da8
hsl(202, 15%, 60%)
selfhtml-Logo, Info, Autor (Forum) Die Energie des Verstehens 2.81:1
lichtes blaugrau #e4ebf2
hsl(210, 35%, 92%)
background-color: #e4ebf2; border: #8a9da8 10.51:1
helles graublau #c4d4da
hsl(196, 23%, 81%)
Strich, 2px Strich, helles graublau, 2px
#f6f9fc
hsl(210, 50%, 98%)
Forum, Antwort
nicht verwendet
background-color: #f6f9fc; border: #8a9da8
#fcfcfc
hsl(0, 0%, 99%)
Forum, Quelltext
nicht verwendet
background-color: #fcfcfc; border: #8a9da8

unterschiedliche Linkfarben[Bearbeiten]

Farbe Farbwert Beispiel Kontrast
#2673bf #2673bf
hsl(210, 67%, 45%)
aktuelle Linkfarbe im Wiki 4.90:1
FAIL
#3481CD #3481CD
hsl(210, 60%, 50%)
aktuelle Linkfarbe im Forum und Blog 4.06:1
FAIL
blau #3983ab
hsl(201, 50%, 45%)
Linktext in SELF-blau 4.19:1
FAIL
dunkelblau #337599
hsl(201, 50%, 40%)
mein Vorschlag 5.07:1
PASS
dunkelblau #295E7A
hsl(201, 50%, 32%)
find ich zu dunkel
zu wenig Unterschied zum plain text
7.06:1
PASS
orange #df6c20
a:hover im Wiki 3.33:1
WTF


nicht verwendete Reservefarben[Bearbeiten]

Farbe Farbwert Verwendung Beispiel
hsl(47, 100%, 53%)
#866a00
background-color: #e7c157; color: #866a00
helles gelb hsl(44, 75%, 62%)
#e7c157
orange #df6c20
hsl(24, 75%, 50%)
lichtes orange #ffede0
hsl(25, 100%, 94%)
background-color: #ffede0; border: #df6c20
dunkelgrün hsl(85, 100%, 30%)
#5a9900
kühles blau hsl(222, 62%, 61%)
#5c82d9
lila #9357b9
hsl(277, 53%, 73%)
einzige Verwendung:
sociallink-Spenden der Landing Page

Siehe auch[Bearbeiten]