← Auswahl
Design System Preview

Tokens & Komponenten

Dieses System übersetzt den Wöstmann-Look in klare, wiederverwendbare Bausteine: traditionell, kantig, hochwertig, warm und modern. Alle Elemente nutzen bewusst scharfe Kanten statt runder Border-Radien.

Color Tokens

01 / Farben
Ink#171412
Cream#F7F1E8
Paper#EFE4D3
Butcher Red#8F2E24
Brown#704A34
Muted Text#6D6259
Paper 2#E4D2BC
White#FFFFFF

Typography

02 / Schrift
Headline Serif
Familientradition seit 1916

Playfair Display für emotionale, traditionelle Headlines.

Body Sans
Regionale Herkunft, eigene Schlachtung und handwerkliche Verarbeitung bilden die Grundlage der Marke.

Inter für Lesbarkeit, UI-Texte und Fließtext.

Condensed Label
Verkaufswagen finden

Oswald für Navigation, Labels und starke CTAs.

Editorial Mix
Qualität aus der Region
Handwerk · Frische · Vertrauen

Spacing & Shape Tokens

03 / Layout
Containermax-width: 1180px

Ruhige Lesebreite für Premium-Layout.

Section Padding110px desktop / 72px mobile

Großzügiger Abstand wie Editorial Design.

Border Radius0px

Kantiger, handwerklicher Look ohne runde UI-Elemente.

Border1px solid rgba(112,74,52,.20)

Warme Linien statt kalter Grautöne.

Shadow0 24px 80px rgba(15,13,11,.16)

Nur für wichtige Layer und Overlays.

TexturePaper noise overlay

Subtiler Vintage-Charakter.

Components

04 / UI Bausteine

Buttons

Klare CTAs mit kantigen Kanten und hoher Lesbarkeit.

Primary CTA Dark Button Outline Button

Navigation

HomeTraditionProdukteKontakt

Condensed uppercase navigation mit klarer Hierarchie.

Product Card

Schinken & Räucherwaren

Herzhafte Klassiker aus handwerklicher Herstellung.

Location Card

Milte

Hesselstraße 2, 48231 Warendorf-Milte

Mi.8:00 – 13:00
Sa.8:00 – 12:30