De zaak voor Lily

Begin bij je eigen ontwerp

Je team weet al hoe je product eruit moet zien. Lily begint precies daar: het levert de onderdelen die echt moeilijk goed te krijgen en duur om over te doen zijn – het juiste semantische element, de ARIA-statussen, het toetsenbordcontract, focusbeheer – en laat elke visuele beslissing volledig en met vreugde aan jou. Jouw CSS is vanaf dag één de uitstraling van het designsysteem.

Omdat elke component een stabiele klassenhaak en pure structuur heeft, blijft je opmaak bij elke upgrade netjes van jou – en blijft de toegankelijkheid eronder werken, versie na versie.

Waar Lily zich aan committeert

• Standaard toegankelijk. WCAG 2.2 AAA is het doel voor elke component. De patronen volgen de WAI-ARIA Authoring Practices, elke interactieve component is met het toetsenbord te bedienen volgens een gedocumenteerd contract, en de voorbeeldapps houden een schone axe-core-basislijn aan.
• Per ontwerp te internationaliseren. Elke voor de gebruiker zichtbare tekenreeks – elk label, elke fout en elke aankondiging – is een prop met stabiele namen in alle frameworks, zodat vertalen vanzelf gaat. RTL en bidirectionele tekst erven van je dir. Locatiebewuste componenten nemen de taal als prop, altijd expliciet.
• Eén catalogus, acht frameworks. Dezelfde 571 componenten (536 als native Web Components) met dezelfde klassenhaken en prop-conventies in HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks en Web Components. Je CSS en de kennis van je team zijn over te dragen tussen stacks.
• Onafhankelijk van je CSS-strategie. Eén stabiele kebab-case klasse per componentroot. Semantische CSS, Tailwind-utilities, CSS-in-JS of een van de 57 kant-en-klare thema's – Lily verwelkomt ze allemaal en blijft elegant uit de weg.
• Gratis, voor altijd, op jouw voorwaarden. Opensource onder een licentie naar keuze: BSD, MIT, Apache-2.0, GPL-2.0 of GPL-3.0. Geen pro-variant, geen gebruikerslicenties, geen telemetrie.

Diepgang waar het ertoe doet

Naast de gebruikelijke knoppen en dialogen reikt de catalogus verder dan de meeste:

• Patronen voor de publieke sector onderzocht bij de designsystemen van NHS UK, GOV.UK, USWDS en ONS – foutsamenvattingen, waarschuwingsblokken, samenvattingslijsten, fasebanners en skip-links.
• 140 componenten voor nationale persoonsidentificatie voor identificatiemiddelen uit de gezondheidszorg, nationale identiteit, belasting en paspoorten in meer dan 50 landen, elk met gedocumenteerd formaat en validatiealgoritme.
• Bouwstenen voor redactioneel werk en scrollytelling overgenomen van Reuters Graphics – artikellay-outs, scrollers, tijdlijnen, tegelkaarten.
• Kiezerhelpers – kleine pakketten die één interactie van begin tot eind beheren: themawissel (met het laden van stylesheets tijdens runtime), taal, tekstgrootte, verminderde beweging, zoeken, paginalinks, delen en invoer van datum en tijd. Elk is een headless pictogramknop die een pop-up opent – geen native <select> – met persistentie en SSR-veiligheid ingebouwd.

Thema's voor de publieke sector, kant-en-klaar

Lily levert 57 zelfstandige referentiethema's die rechtstreeks op de klassenhaken mikken: NHS England, NHS Scotland en NHS Wales (elk in varianten voor patiënten en voor professionals), GOV.UK, USWDS, kleurenpaletten geïnspireerd op Adobe Spectrum en Mozilla Protocol, en een set algemene lichte en donkere thema's. Koppel één stylesheet en een uitstraling op overheidsniveau staat aan; de helper theme-picker wisselt ze tijdens runtime.

Hoe Lily zich verhoudt

We houden een eerlijke vergelijking bij, component voor component, met andere designsystemen – opgemaakt en headless, commercieel en publieke sector. Waar een andere bibliotheek beter bij je past, laat de vergelijking dat zien; Lily leert van allemaal en noemt zijn inspiratiebronnen openlijk.

Wie erachter zit

Lily is een jong, onafhankelijk opensourceproject dat samenwerking, begeleiding en feedback verwelkomt – zie Over voor het verhaal en de inspiratiebronnen. Alles – de specificatie, de tests, de roadmap, zelfs de auditgereedschappen – is openbaar op github.com/LilyDesignSystem.

Help Lily groeien

Als Lily nuttig voor je is, zijn dit de waardevolste dingen die je kunt doen:

• Geef een ster en deel. Geef een ster aan de hoofdrepository en laat een collega de catalogus zien – bekendheid is het schaarsste dat een jong project heeft.
• Bouw iets en vertel het ons. Gebruiksverslagen uit de praktijk – wat werkte, wat soepeler kon – bepalen de roadmap meer dan wat ook.
• Controleer de toegankelijkheid. Rondes met schermlezers (VoiceOver, NVDA, JAWS) op de voorbeeldapps zijn goud waard; meld wat je vindt.
• Draag een thema of een vertaling bij. Beide zijn op zichzelf staande, goed afgebakende eerste bijdragen.
• Deel wat je vindt, met een minimale reproductie, in de GitHub-repository, of mail naar joel@joelparkerhenderson.com.