Design System
Playground Zur Vorlage

Komponenten · InhaltZitat-Block

Komponente · 6 Varianten

Zitat-Block

components/ZitatBlock.astro

Pull-Quote: nw-quote, H2 oder Display; mit Kante links, mit Quelle und Strich; im Fließtext zwischen Haarlinien.

Notizen

  • Bestand: nw-quote Klasse, Testimonial-Featured. Kein freier Block.
  • Kein Anführungs-Ornament, kein Fond.

Props

Name Typ Default Notiz
variant "quote" | "gross" | "kante" | "quelle" | "im-fluss" | "display" "quote" 01–06.
surface "nacht" | "paper" "nacht" Pflicht-Paar.
<ZitatBlock variant="quote" surface="nacht" />

01 · Quote

nw-quote

Typografie. Basis.

Nacht

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.

Paper

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.

02 · Groß

H2 mit Quelle

Testimonial-Featured. Eine pro Fläche.

Nacht

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.
Daniel Schmidt, Werk

Paper

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.
Daniel Schmidt, Werk

03 · Kante

Kante links in fg

Callout. pl-6.

Nacht

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.

Paper

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.

04 · Quelle

Strich, Name, Rolle

Meta. gedimmt.

Nacht

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.
Daniel Schmidt, Werk

Paper

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.
Daniel Schmidt, Werk

05 · Im Fluss

Haarlinien oben und unten

Prose. my-12.

Nacht

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.

Paper

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.

06 · Display

nw-display

Manifest. max-w-4xl.

Nacht

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.
Daniel Schmidt, Werk

Paper

Wir bauen keine Websites. Wir legen Fläche, die gefunden wird und trägt.
Daniel Schmidt, Werk