Starter Template

Komponenten-Demo

Live-Referenz aller Bausteine im Starter. Nutze diese Seite als Spickzettel beim Aufbau neuer Pages.

Section mit tone="muted"

Diese Section nutzt den abgedämpften Hintergrund (surface-muted) für visuellen Rhythmus zwischen Abschnitten.

Headings

SectionHeader-Varianten

h3 ohne Eyebrow

Mit Eyebrow

h3 mit Eyebrow

Buttons

Container im prose-Modus

Schmalere Spalte (max-w-prose, 672px) für lange Lesetexte — z.B. Blogposts oder Impressum.

Weiterer Absatz zur Demonstration der Text-Breite. Das Default-Container ist 1152px breit.

Bilder

Für Raster-Bilder lege Dateien unter src/assets/ ab und nutze <Image> bzw. <Picture> aus astro:assets. Astro optimiert zur Build-Zeit (WebP/AVIF, srcset, hashed filenames). SVGs (z.B. Logo) können als statische Datei in public/assets/ liegen und per <img> referenziert werden.