Argumentet for Lily
Lily gir deg de vanskelige delene — semantikk, tilgjengelighet, tastaturoppførsel, internasjonalisering — og overlater utseendet helt, gjerne, til deg.
Start fra designet ditt
Teamet ditt vet allerede hvordan produktet skal se ut. Lily starter akkurat der: den leverer delene som er virkelig vanskelige å få riktig og dyre å gjøre om — riktig semantisk element, ARIA-tilstandene, tastaturkontrakten, fokushåndteringen — og overlater hver visuelle beslutning helt, med glede, til deg. CSS-en din er designsystemets utseende, fra dag én.
Fordi hver komponent har en stabil klassekrok og ren struktur, forblir stilen din tydelig din gjennom alle oppgraderinger — og tilgjengeligheten under fortsetter å fungere, versjon etter versjon.
Hva Lily forplikter seg til
- Tilgjengelig som standard. WCAG 2.2 AAA er målet for hver komponent. Mønstrene følger WAI-ARIA Authoring Practices; hver interaktiv komponent kan betjenes med tastatur etter en dokumentert kontrakt; eksempelappene holder en ren axe-core-baseline.
-
Kan internasjonaliseres fra grunnen av. Hver tekststreng brukeren ser — hver etikett, feil og kunngjøring — er en egenskap med stabile navn på tvers av rammeverk, slik at oversettelse flyter naturlig. RTL og toveis tekst arves fra din
dir. Lokaltilpassede komponenter tar lokalet som en egenskap, alltid eksplisitt. - Én katalog, åtte rammeverk. De samme 571 komponentene (536 som native Web Components) med de samme klassekrokene og egenskapskonvensjonene i HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks og Web Components. CSS-en din og teamets kunnskap overføres mellom teknologistabler.
- Nøytral til CSS-strategi. Én stabil kebab-case-klasse per komponentrot. Semantisk CSS, Tailwind-verktøyklasser, CSS-in-JS, eller ett av de 57 ferdige temaene — Lily ønsker dem alle velkommen og holder seg elegant unna.
- Gratis, for alltid, på dine vilkår. Åpen kildekode under ditt valg av BSD, MIT, Apache-2.0, GPL-2.0 eller GPL-3.0. Ingen pro-nivå, ingen setelisenser, ingen telemetri.
Dybde der det betyr noe
Utover de vanlige knappene og dialogene rekker katalogen lenger enn de fleste:
- Mønstre for offentlig sektor undersøkt fra designsystemene til NHS UK, GOV.UK, USWDS og ONS — feiloppsummeringer, advarselsbokser, sammendragslister, fasebannere, hopp-lenker.
- 140 komponenter for nasjonale personlige identifikatorer som dekker helse-, nasjonale ID-, skatte- og passidentifikatorer i over 50 land, hver med dokumentasjon av format og valideringsalgoritme.
- Redaksjonelle og scrollytelling-primitiver tilpasset fra Reuters Graphics — artikkeloppsett, scrollere, tidslinjer, flisekart.
-
Velgerhjelpere — små pakker som eier én interaksjon fra ende til annen: temabytte (med innlasting av stilark ved kjøretid), språk, tekststørrelse, redusert bevegelse, søk, sidelenker, deling og dato-tid-inntasting. Hver er en hodeløs ikonknapp som åpner en popup — ikke en native
<select>— med persistens og SSR-sikkerhet innebygd.
Temaer for offentlig sektor, rett ut av esken
Lily leveres med 57 frittstående referansetemaer som retter seg direkte mot klassekrokene: NHS England, NHS Scotland og NHS Wales (hver i pasientrettede og utøverrettede varianter), GOV.UK, USWDS, paletter inspirert av Adobe Spectrum og Mozilla Protocol, og et sett generelle lyse og mørke temaer. Lenk til ett stilark, så er et utseende på regjeringsnivå på plass; hjelperen theme-picker bytter dem ved kjøretid.
Hvordan Lily sammenlignes
Vi fører en ærlig, komponent-for-komponent sammenligning med andre designsystemer — stilede og hodeløse, kommersielle og offentlig sektor. Der et annet bibliotek passer deg bedre, vil sammenligningen vise det; Lily lærer av dem alle og siterer inspirasjonene sine åpent.
Hvem som står bak
Lily er et ungt, uavhengig prosjekt med åpen kildekode som ønsker samarbeid, veiledning og tilbakemeldinger velkommen — se Om for historien og inspirasjonene. Alt — spesifikasjonen, testene, veikartet, til og med revisjonsverktøyene — er åpent på github.com/LilyDesignSystem.
Hjelp Lily å vokse
Hvis Lily er nyttig for deg, er dette de mest verdifulle tingene du kan gjøre:
- Gi en stjerne og del. Gi en stjerne til hovedrepoet og vis en kollega katalogen — bevissthet er den knappeste ressursen et ungt prosjekt har.
- Bygg noe og fortell oss. Rapporter om bruk i den virkelige verden — hva som fungerte, hva som kunne vært jevnere — former veikartet mer enn noe annet.
- Revider tilgjengelighet. Skjermleser-gjennomganger (VoiceOver, NVDA, JAWS) av eksempelappene er gull verdt; send inn det du finner.
- Bidra med et tema eller en oversettelse. Begge er selvstendige, godt avgrensede første bidrag.
- Del det du finner, med en minimal reproduksjon, i GitHub-repoet, eller send e-post til joel@joelparkerhenderson.com.