Farbverwaltung Shop-Management

zurück zur CSS-Doku

Die hier vorgestellten Daten gelten für Template-Versionen >= 8.0.0.0

Hintergrundfarben

Allgemeine Hintergrundfarben

BezeichnungFarbwertAuswirkungCSS-Klasse
Hintergrundfarbe#ffffffvertikales Menü ab zweiter Ebene Bild in Artikel-Listung Eingabefelder Megamenü Slidemenü auf Bildschirmen < 880 Pixel Header auf Bildschirmen < 880 Pixel Infobox allgemeine Box mit Haupt-Hintergrundfarbe (Neuheiten, Bestseller, RDE, ...) Rahmenfarbe 1 Tabs in Detailseite Subnavigationbg-color_color1
bg-color_light
2. Hintergrundfarbe#f3f3f3Daten in Artikel-Listung Daten in Artikeldetail Areas mit Hintergrund Rahmenfarbe 2 allgemeine Box mit Neben-Hintergrundfarbebg-color_color2
3. Hintergrundfarbe#eeeeeevertikales Menü erste Ebene Überschriften mit Box Rahmenfarbe 3 Navigation 6 unter Topnavigationbg-color_color3
bg-color_smooth
4. Hintergrundfarbe#e2e2e2Rahmenfarbe 4bg-color_color4
5. Hintergrundfarbe#ddddddRahmenfarbe des Headers Rahmenfarbe des Hauptteils Rahmenfarbe des Footers Haupt-Rahmenfarbe 5. Rahmenfarbe Hintergrund Produktname in Catblog Speedbar im Checkout Einheit bei Warenkorbfeldern Reservieren-Button Suchvorschläge Tabs:hover in Detailseitebg-color_color5
bg-color_strong
6. Hintergrundfarbe#dadada6. Rahmenfarbebg-color_color6
7. Hintergrundfarbe#cccccc7. Rahmenfarbe Rahmen um Eingabefelderbg-color_color7
8. Hintergrundfarbe#aaaaaaReservieren-Button:hover modaler Hintergrund 8. Rahmenfarbe Schattenfarbebg-color_color8
bg-color_dark

Die Hintergrundfarben werden auch für das Zeichnen von Rahmen verwendet. Die Standard-Rahmenfarbe ist die 5. Hintergrundfarbe (#dddddd).

Flächenfarben

Spezial-Fläche

Spezialflächen betreffen das Benutzer-Menü im Header mit Login, Merkzettel, Sprache, usw.

FeldFarbwertAuswirkung
1#f3f3f3erster Farbwert für den Hintergrundverlauf
2#eeeeeezweiter Farbwert für den Hintergrundverlauf
3#ddddddnicht belegt
4#ccccccRahmenfarbe für das Benutzer-Menü im Header

Fläche

Fläche 1Die Flächen-Farben bestimmen das Aussehen der Standard-Buttons

FeldFarbwertAuswirkung
1#ddddddRahmenfarbe oben Rahmenfarbe rechts erste Verlaufsfarbe
2#ddddddHintergrundfarbe ohne Verlauf zweite Verlaufsfarbe bei Hover
3#ccccccRahmenfarbe unten Rahmenfarbe links zweite Verlaufsfarbe erste Verlaufsfarbe bei Hover
4#ccccccnicht belegt

Fläche 2Nicht mehr verwendet.

Schriftfarben

BezeichnungFarbwertAuswirkungCSS-Klasse
Standard-Schriftfarbe#333333Hauptschriftfarbef-color_basic
2. Schriftfarbe#555555Farbe für Hyperlinks mit » Schriftfarbe des Reservieren-Buttonsf-color_color1
3. Schriftfarbe#777777allgemeine Hinweise im Footer Hover im Megamenü Hover-Farbe von hervorgehobenen Links Label von Input-feldernf-color_color2
f-color_light
4. Schriftfarbe#888888Breadcrumb Herstellernamef-color_color3
5. Schriftfarbe#aaaaaaSchatten für Megamenü, Subnavi, Catblogf-color_color4
f-color_lighter
6. Schriftfarbe#ddddddleeres Bewertungs-Sternchen hr Tabellenrahmenf-color_color5
f-color_lightest
f-color_disabled
Wichtige Hinweise#cd0a0aHinweise auf Verkaufsaktionen Pflichtfeld Fehlermeldungenf-color_warning
f-color_prominent
weiche Info#008000Speedbar fröhlicher Link Hinweise Preisef-color_notice
Text in Eingabefeld#2f2f2fInput-Felder
Grafikfarbe#333333