Design System
Playground Zur Vorlage

Komponenten · NavigationWechsel

Komponente · 6 Varianten

Wechsel

components/Wechsel.astro

Sprache als DE · EN in Mono oder Select, Thema als Toggle, Segment oder Punkt-Knopf. Im Fuß kombiniert.

Notizen

  • Bestand: kein Wechsel. Nacht/Paper ist Prop, kein Nutzer-Schalter.
  • Entscheidung 2026-09-02: Die Site bekommt einen Nutzer-Schalter Nacht/Paper. Runtime folgt bei Promotion (prefers-color-scheme, localStorage).

Props

Name Typ Default Notiz
variant "sprache-text" | "sprache-select" | "thema-toggle" | "thema-segment" | "thema-icon" | "fuss" "sprache-text" 01–06.
surface "nacht" | "paper" "nacht" Pflicht-Paar.
<Wechsel variant="sprache-text" surface="nacht" />

01 · Sprache Text

DE · EN

Footer. hreflang, aria-current.

Nacht

DE·EN

Paper

DE·EN

02 · Sprache Select

Native Auswahl

Feld. Für viele Sprachen.

Nacht

Paper

03 · Thema Toggle

Switch

Wahl toggle. role=switch.

Nacht

Paper

04 · Thema Segment

Paper · Nacht · System

Tabs voll. radiogroup.

Nacht

Paper

05 · Thema Icon

Punkt im Rahmen

Signal. aria-pressed.

Nacht

Paper

06 · Fuß

Sprache links, Thema rechts

Footer. Haarlinie oben.

Nacht

DE · EN ThemaPaperNacht

Paper

DE · EN ThemaPaperNacht