KLEIDI GUNG / VISUELLES SYSTEM
Style Guide
Ein ernsthaft behandeltes Erscheinungsbild für ein Projekt, das es mit Ernsthaftigkeit eher situativ hält.
Farbpalette
Creme
#F5F0E6
--kg-color-cream
Grundfläche und warmer Papierhintergrund
Surface
#FCFAF6
--kg-color-surface
Fokuszustände und leicht angehobene helle Flächen
Anthrazit
#2A2724
--kg-color-anthracite
Fließtext, Navigation und Standard-UI
Bordeaux
#6B1F26
--kg-color-bordeaux
Primäre Aktionen, Links und gezielte Akzente
Bordeaux Hover
#551318
--kg-color-bordeaux-hover
Hover- und Fokuszustände primärer Aktionen
Champagner-Gold
#C9A65B
--kg-color-gold
Sparsamer dekorativer Sekundärakzent
Beige-Grau
#E0D6C2
--kg-color-border
Hairlines, Rahmen und ruhige Trennungen
Tiefanthrazit
#1A1815
--kg-color-dark
Dunkle Kontrastflächen wie der Footer
Typografie
H1 · clamp(2.25rem, 5vw, 3.5rem)
Mode ist eine ernste Angelegenheit.
H2 · clamp(1.75rem, 4vw, 2.5rem)
Zumindest bis zum nächsten Outfit.
H3 · clamp(1.375rem, 3vw, 1.75rem)
Eine Haltung mit Wechselgarderobe.
Body · Inter · 1.0625rem
Kleidi Gung betrachtet Stil als kulturelle Hochleistung, solange niemand nach den praktischen Details fragt. Inter hält diese Behauptung angenehm nüchtern und lesbar.
Buttons
Cards
Elevated
Für Inhalte, die tatsächlich über der Fläche schweben sollen. Der Schatten ist hier Hierarchie, nicht Dekoration.
Bordered
Für leise Gruppierung mit feiner Kontur. Mehr Rahmen wäre bereits eine Meinung und davon gibt es online genug.
Spacing-Skala
lg bis 3xl sind clamp()-basiert und reagieren auf den Viewport.