Wo Amaryllis außerdem lebt.
Quellen, Links, Downloads. Alles, was man braucht, um das System in Figma, Claude Design oder direkt im Code zu benutzen.
Ein System, mehrere Oberflächen.
KI-gestützte Generierung im Amaryllis-Look
Dieses Designsystem ist an claude.ai/design angebunden. Neue Screens, Slides und Mockups aus dem Claude-Chat tragen automatisch das Amaryllis-Vokabular.
Zum System →maschenborn/amaryllis
Das Repo. Astro + Bun + Tailwind v4 + Neue DIN Variable. Alle Komponenten, Tokens und Pages sind hier eingecheckt.
Zum Repo →Amaryllis Figma-Library
Eine Figma-Bibliothek ist in Vorbereitung. Wird hier verlinkt, sobald veröffentlicht — inkl. Code-Connect zu den Astro-Komponenten.
FolgtNeue DIN Variable (Fontwerk)
Die Font-Datei liegt im Repo unter public/fonts/. Lizenzierung via Fontwerk — intern freigegeben, nicht öffentlich verteilbar.
Infos →Was sich bewegt hat.
- v0.3
- Corporate-Design-Guide-Struktur: Foundations, Components, Brand, Resources
- Topbar, AlertStrip, Footer, Band, Container als eigenständige Komponenten
- Button, Tag, Card, SectionLabel, Logo als UI-Primitives
- Data-driven Navigation aus src/data/nav.ts
- Claude-Design-Anbindung dokumentiert
- v0.2
- Akzent-Familie geöffnet: Highlighter, Cyan (korrekter Hex), Mint, Grass
- Inline-Hex via style="--accent: #xxxxxx" möglich
- Alert-Strip und Hero-Gradient als Primitives
- v0.1
- Initiales Astro + Bun + Tailwind-4-Gerüst
- Neue DIN Variable als einziger Display- und Body-Font
- Marker-Technik per linear-gradient
- One-Accent-Per-Page-Prinzip über CSS-Variable
Das nächste Screen-Mockup aus Amaryllis.
Schick Claude Design, was Du brauchst — eine Landing-Seite, einen Slide-Deck, ein internes Tool. Der Output kommt im Amaryllis-Look, ohne dass Du Tokens oder Komponenten manuell kopieren musst.