Design System
PIA YourSpace — visuelle Referenz für Farben, Typografie, Komponenten und Bewegung. Diese Seite ist selbst Teil des Systems: Änderungen hier bedeuten Änderungen an der Website.
Farben
Primary
#97C3CF
Black
#000000
White
#FFFFFF
Typografie
Display / Manrope ExtraBold — clamp(2.75rem, 4vw + 1.5rem, 6rem)
Hier darf ich kurz durchatmen.
H1 / Manrope ExtraBold — clamp(2.25rem, 3vw + 1.25rem, 4.5rem)
Räume für Veränderung
H2 / Manrope ExtraBold — clamp(1.75rem, 2vw + 1rem, 3rem)
Ein Ort zum Ankommen
Body Large / Inter — clamp(1.125rem, 0.4vw + 1rem, 1.375rem)
Ruhige, klare Sprache für erklärende Texte.
Body / Inter — clamp(1rem, 0.2vw + 0.95rem, 1.125rem)
Fließtext für alle weiteren Inhalte der Website.
Caption / Inter — clamp(0.8125rem, 0.1vw + 0.8rem, 0.9375rem)
Kleingedrucktes, Labels, Meta-Informationen
Buttons
Spacing-Skala
xxs
8px
xs
16px
sm
24px
md
32px
lg
48px
xl
64px
xxl
96px
xxxl
128px
huge
176px
Radius & Schatten
Radius 10px
Radius 999px
Animations-Prinzipien
Scrolle langsam — jede Karte animiert bei jedem Betreten der Section erneut, ruhig und ohne Bounce.
Floating Card