UI Building Blocks
Sammlung von wiederverwendbaren Komponenten mit Design Tokens und Theming
Buttons
Primary
Secondary
Sizes
Cards
Basic Card
Einfache Karte mit Titel und Beschreibung.
Colored Card
Karte mit primärer Hintergrundfarbe.
Icon Card
Karte mit Icon und Accent-Border.
Hero Sections
Centered Hero Section
Große Überschrift mit zentriertem Text und Call-to-Action Buttons.
Split Layout Hero
Hero Section mit Text auf der linken und Bild/Grafik auf der rechten Seite.
Feature Grid
Feature 1
Beschreibung des Features mit wichtigen Details.
Feature 2
Beschreibung des Features mit wichtigen Details.
Feature 3
Beschreibung des Features mit wichtigen Details.
Feature 4
Beschreibung des Features mit wichtigen Details.
Feature 5
Beschreibung des Features mit wichtigen Details.
Feature 6
Beschreibung des Features mit wichtigen Details.
CTA Sections
Ready to Get Started?
Call-to-Action Section mit großem Titel und prominentem Button.
Form Elements
Alerts / Notifications
✓ Success: Your action was completed successfully.
ℹ Info: This is an informational message.
⚠ Warning: Please review this before proceeding.
✕ Error: Something went wrong.
Badges
Typography
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Body Text (Base): Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Large Text: Sed do eiusmod tempor incididunt ut labore.
Small Text (Secondary): Ut enim ad minim veniam.
Extra Small (Tertiary): Quis nostrud exercitation ullamco.