Background
--background
Reines Weiß. Body-Default.
Brand · Style Guide
Vollständige Brand-Reference: Typo-Specimen, OKLCH-Tokens, Spacing- Scale, Voice-Regeln. Gilt für alle federated Domains (matten.zone, mats.zone, paillasson.zone, mattor.zone) — eine Sprache, vier Wordmarks.
Wordmark-System
DM Sans Medium, tight tracking (−0.045em). Lokales Wort in Foreground, .zone in Ultramarine. Immer als komplettes Lockup, nie nur der Wort-Teil ohne TLD.
Typografie
Display-Scale
Body · Headlines · Wordmark · --font-dm-sans · Open Font License
Editorial-Scale
Editorial · Quotes · Akzent-Headlines · --font-eb-garamond · Open Font License
Display-Scale · DM Sans
Color
Background
--background
Reines Weiß. Body-Default.
Foreground
--foreground
Near-Black für Text + dunkle Flächen.
Primary · Ultramarine
--primary
Akzent. Sparsam einsetzen — CTAs, .zone-Suffix, Active-State, Diff-Highlights.
Secondary
--secondary
Off-White Hintergrund. Cards, Image-Boxen.
Muted
--muted
Identisch zu secondary — Type-Differenzierung via muted-foreground.
Muted Foreground
--muted-foreground
Sekundärer Text · Eyebrows · Captions. Tracking-wide bei Eyebrows.
Border
--border
Subtle dividing line. 1px standard, /60-Opacity für Hairlines.
Destructive
--destructive
Fehler-States, Lösch-Buttons. Sparsam einsetzen.
Spacing
Voice
Tun
Konkret · zahlenbasiert · ohne Marketing-Floskeln.
Lassen
Allgemeinplätze · 'Höchste Qualität' · Superlative.
Tun
Faustregeln statt Listen-Padding (z.B. 'mindestens Türbreite + 10 cm').
Lassen
20-Punkt-Bullet-Listen mit redundanten Items.
Tun
Kurze Sätze. Subjekt zuerst. Aktiv-Form.
Lassen
Schachtelsätze · Passiv · Konjunktiv-Häufung.
Tun
Du-Form auf B2C, Sie-Form auf B2B · konsistent pro Page.
Lassen
Mischformen auf derselben Surface.
Tun
Headlines mit Ultramarine-Punkt am Ende — z.B. 'Manufaktur in Europa.'
Lassen
Mehrere Akzent-Punkte pro Zeile.