Rocketweb Starter

Phase 2e Iteration 1 — Backend-getriebenes Design-System.
Ändere unten verlinkte Tokens im Admin → diese Seite neu laden → live sichtbar.

Design-System im Admin öffnen Demo-Page

v0.2.10 · Phase 2e Iter 2 — @rocketweb/kit live

Brand-Skala

100

200

300

400

500

600

700

800

900

950

Status-Farben

Erfolg

Warnung

Fehler

Headings (fluid via clamp)

H1 — Die schnelle Maus lief flink um die Ecke

H2 — Die schnelle Maus lief flink um die Ecke

H3 — Die schnelle Maus lief flink um die Ecke

H4 — Die schnelle Maus lief flink um die Ecke

H5 — Die schnelle Maus lief flink um die Ecke

H6 — Die schnelle Maus lief flink um die Ecke

Body — Dies ist Fließtext mit der Standardgröße. Auf großen Displays wird er minimal größer, auf Mobile bleibt er kompakt.

Caption — Sehr kleiner Hilfetext für Bildunterschriften und Meta-Infos.

Spacing-Skala

Jeder Block ist so breit wie das entsprechende Spacing-Token.

2XL

Radius-Skala

2XL

Full

Button-Presets

Fünf Standardvarianten — Backend-Edit (Background/Text/Border) greift sofort.

Backend → Frontend, live

Diese Seite liest pro Request das Design-System-Global aus Payload. Ändere im Admin z.B. die Brand-500-Farbe auf oklch(0.6 0.22 25) (knall-orange), speichere — und sieh sofort beim Reload: Buttons, Akzente, Status-Farben verschieben sich mit.

→ Design-System editieren