Argumenten för Lily
Lily tar hand om de svåra delarna – semantik, tillgänglighet, tangentbordsbeteende, internationalisering – och lämnar utseendet helt och glatt åt dig.
Utgå från din design
Ditt team vet redan hur din produkt ska se ut. Lily börjar precis där: det levererar de delar som är genuint svåra att göra rätt och dyra att göra om – rätt semantiskt element, ARIA-tillstånden, tangentbordskontraktet, fokushanteringen – och lämnar varje visuellt beslut helt och med glädje åt dig. Din CSS är designsystemets utseende, från dag ett.
Eftersom varje komponent har en stabil klasskrok och ren struktur förblir din formgivning ren och din egen genom varje uppgradering – och tillgängligheten under ytan fortsätter att fungera, version efter version.
Vad Lily förbinder sig till
- Tillgängligt som standard. WCAG 2.2 AAA är målet för varje komponent. Mönstren följer WAI-ARIA Authoring Practices, varje interaktiv komponent går att styra med tangentbord enligt ett dokumenterat kontrakt, och exempelapparna håller en ren axe-core-baslinje.
-
Internationaliserbart genom konstruktion. Varje användarvänd sträng – varje etikett, fel och avisering – är en egenskap med stabila namn i alla ramverk, så att översättning flyter naturligt. RTL och dubbelriktad text ärver från ditt
dir. Språkmedvetna komponenter tar språket som en egenskap, alltid uttryckligen. - En katalog, åtta ramverk. Samma 571 komponenter (536 som inbyggda Web Components) med samma klasskrokar och egenskapskonventioner i HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks och Web Components. Din CSS och ditt teams kunskap följer med mellan teknikstackar.
- Oberoende av CSS-strategi. En stabil klass i kebab-case per komponentrot. Semantisk CSS, Tailwind-verktygsklasser, CSS-in-JS eller något av de 57 färdiga temana – Lily välkomnar dem alla och håller sig elegant i bakgrunden.
- Gratis, för alltid, på dina villkor. Öppen källkod under ditt val av BSD, MIT, Apache-2.0, GPL-2.0 eller GPL-3.0. Ingen proversion, inga användarlicenser, ingen telemetri.
Djup där det spelar roll
Utöver de vanliga knapparna och dialogerna når katalogen längre än de flesta:
- Mönster för offentlig sektor som har utretts från designsystemen hos NHS UK, GOV.UK, USWDS och ONS – felsammanfattningar, varningsrutor, sammanfattningslistor, fasbanderoller och hoppa-över-länkar.
- 140 komponenter för nationella personidentifierare som täcker identifierare för hälso- och sjukvård, nationella id-handlingar, skatt och pass i över 50 länder, var och en med dokumenterat format och valideringsalgoritm.
- Byggstenar för redaktionellt innehåll och scrollytelling anpassade från Reuters Graphics – artikellayouter, scrollare, tidslinjer och kartplattor.
-
Väljarhjälpare – små paket som äger en interaktion från början till slut: temabyte (med inläsning av formatmall vid körning), språk, textstorlek, minskad rörelse, sökning, sidlänkar, delning och inmatning av datum och tid. Var och en är en huvudlös ikonknapp som öppnar en popup – inte en inbyggd
<select>– med beständighet och SSR-säkerhet inbyggt.
Teman för offentlig sektor, direkt ur lådan
Lily levereras med 57 fristående referensteman som riktar sig direkt mot dess klasskrokar: NHS England, NHS Scotland och NHS Wales (var och en i patientvända och yrkesvända varianter), GOV.UK, USWDS, paletter inspirerade av Adobe Spectrum och Mozilla Protocol, samt en uppsättning allmänna ljusa och mörka teman. Länka en formatmall så är ett utseende i myndighetsklass på; hjälparen theme-picker byter dem vid körning.
Hur Lily står sig
Vi för en ärlig jämförelse, komponent för komponent, mot andra designsystem – med och utan formgivning, kommersiella och för offentlig sektor. Där ett annat bibliotek passar dig bättre visar jämförelsen det; Lily lär av alla och redovisar öppet sina inspirationskällor.
Vilka står bakom
Lily är ett ungt, oberoende projekt med öppen källkod som välkomnar samarbete, vägledning och återkoppling – se Om för berättelsen och inspirationskällorna. Allt – specifikationen, testerna, färdplanen, till och med granskningsverktygen – finns öppet på github.com/LilyDesignSystem.
Hjälp Lily att växa
Om Lily är användbart för dig är det här det mest värdefulla du kan göra:
- Stjärnmärk och dela. Stjärnmärk huvudrepot och visa en kollega katalogen – synlighet är den knappaste resursen ett ungt projekt har.
- Bygg något och berätta för oss. Rapporter om verklig användning – vad som fungerade, vad som kunde gå smidigare – formar färdplanen mer än något annat.
- Granska tillgängligheten. Genomgångar med skärmläsare (VoiceOver, NVDA, JAWS) på exempelapparna är guld värda; rapportera det du hittar.
- Bidra med ett tema eller en översättning. Båda är fristående, väl avgränsade första bidrag.
- Dela det du hittar, med en minimal reproduktion, i GitHub-repot, eller mejla joel@joelparkerhenderson.com.