Das Argument für Lily

Beginnen Sie bei Ihrem Design

Ihr Team weiß bereits, wie Ihr Produkt aussehen soll. Lily beginnt genau dort: Es liefert die Teile, die wirklich schwer richtig hinzubekommen und teuer neu zu machen sind – das richtige semantische Element, die ARIA-Zustände, den Tastaturvertrag, die Fokusverwaltung – und überlässt jede visuelle Entscheidung ganz und mit Freude Ihnen. Ihr CSS ist vom ersten Tag an das Aussehen des Designsystems.

Weil jede Komponente einen stabilen Klassen-Hook und reine Struktur mitbringt, bleibt Ihre Gestaltung bei jedem Upgrade sauber Ihre eigene – und die Barrierefreiheit darunter funktioniert weiter, Version für Version.

Wozu sich Lily verpflichtet

• Standardmäßig barrierefrei. WCAG 2.2 AAA ist das Ziel für jede Komponente. Die Muster folgen den WAI-ARIA Authoring Practices, jede interaktive Komponente ist mit einem dokumentierten Vertrag per Tastatur bedienbar, und die Beispiel-Apps halten eine saubere axe-core-Baseline.
• Von Grund auf internationalisierbar. Jede für Nutzer sichtbare Zeichenkette – jede Beschriftung, jeder Fehler, jede Ansage – ist ein Prop mit über alle Frameworks stabilen Namen, sodass Übersetzung ganz natürlich fließt. RTL und bidirektionaler Text erben von Ihrem dir. Sprachabhängige Komponenten erhalten die Sprache als Prop, immer ausdrücklich.
• Ein Katalog, acht Frameworks. Dieselben 571 Komponenten (536 als native Web Components) mit denselben Klassen-Hooks und Prop-Konventionen in HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks und Web Components. Ihr CSS und das Wissen Ihres Teams lassen sich über Stacks hinweg übertragen.
• Unabhängig von der CSS-Strategie. Eine stabile Kebab-Case-Klasse pro Komponentenwurzel. Semantisches CSS, Tailwind-Utilities, CSS-in-JS oder eines der 57 fertigen Themes – Lily heißt sie alle willkommen und hält sich elegant im Hintergrund.
• Kostenlos, für immer, zu Ihren Bedingungen. Open Source unter einer Lizenz Ihrer Wahl: BSD, MIT, Apache-2.0, GPL-2.0 oder GPL-3.0. Keine Pro-Stufe, keine Benutzerlizenzen, keine Telemetrie.

Tiefe, wo sie zählt

Über die üblichen Schaltflächen und Dialoge hinaus reicht der Katalog weiter als die meisten:

• Muster für den öffentlichen Sektor recherchiert aus den Designsystemen von NHS UK, GOV.UK, USWDS und ONS – Fehlerzusammenfassungen, Warnhinweise, Zusammenfassungslisten, Phasenbanner, Sprunglinks.
• 140 Komponenten für nationale Personenkennzeichen für Kennungen aus Gesundheitswesen, nationalen Ausweisen, Steuer und Reisepässen in über 50 Ländern, jeweils mit dokumentiertem Format und Validierungsalgorithmus.
• Bausteine für Redaktion und Scrollytelling übernommen von Reuters Graphics – Artikellayouts, Scroller, Zeitleisten, Kachelkarten.
• Picker-Helfer – kleine Pakete, die je eine Interaktion von Anfang bis Ende verantworten: Theme-Wechsel (mit Laden von Stylesheets zur Laufzeit), Sprache, Textgröße, reduzierte Bewegung, Suche, Seitenlinks, Teilen und Eingabe von Datum und Uhrzeit. Jeder ist eine Headless-Icon-Schaltfläche, die ein Popup öffnet – kein natives <select> – mit eingebauter Persistenz und SSR-Sicherheit.

Themes für den öffentlichen Sektor, sofort einsatzbereit

Lily liefert 57 eigenständige Referenz-Themes, die direkt auf seine Klassen-Hooks zielen: NHS England, NHS Scotland und NHS Wales (jeweils in Varianten für Patienten und für Fachkräfte), GOV.UK, USWDS, von Adobe Spectrum und Mozilla Protocol inspirierte Paletten sowie eine Reihe allgemeiner heller und dunkler Themes. Binden Sie ein Stylesheet ein, und ein behördentaugliches Aussehen ist aktiv; der Helfer theme-picker wechselt sie zur Laufzeit.

Wie Lily im Vergleich abschneidet

Wir pflegen einen ehrlichen Vergleich, Komponente für Komponente, mit anderen Designsystemen – gestaltet und headless, kommerziell und öffentlicher Sektor. Wo eine andere Bibliothek besser zu Ihnen passt, zeigt der Vergleich das; Lily lernt von allen und nennt seine Inspirationsquellen offen.

Wer dahintersteht

Lily ist ein junges, unabhängiges Open-Source-Projekt, das Zusammenarbeit, Anleitung und Rückmeldungen begrüßt – siehe Über für die Geschichte und die Inspirationsquellen. Alles – die Spezifikation, die Tests, die Roadmap, sogar die Audit-Werkzeuge – ist offen einsehbar auf github.com/LilyDesignSystem.

Helfen Sie Lily beim Wachsen

Wenn Lily Ihnen nützt, sind dies die wertvollsten Dinge, die Sie tun können:

• Vergeben Sie einen Stern und teilen Sie. Vergeben Sie einen Stern für das Haupt-Repository und zeigen Sie einer Kollegin oder einem Kollegen den Katalog – Bekanntheit ist die knappste Ressource, die ein junges Projekt hat.
• Bauen Sie etwas und erzählen Sie uns davon. Berichte aus der Praxis – was funktioniert hat, was reibungsloser sein könnte – prägen die Roadmap mehr als alles andere.
• Prüfen Sie die Barrierefreiheit. Durchgänge mit Screenreadern (VoiceOver, NVDA, JAWS) auf den Beispiel-Apps sind Gold wert; melden Sie, was Sie finden.
• Steuern Sie ein Theme oder eine Übersetzung bei. Beides sind in sich geschlossene, gut abgegrenzte erste Beiträge.
• Teilen Sie, was Sie finden, mit einer minimalen Reproduktion, im GitHub-Repository, oder schreiben Sie an joel@joelparkerhenderson.com.