Se Lily i ekte apper
Syv ferdige eksempelprosjekter viser hvordan du tar de hodeløse komponentene, legger på stil og leverer et ekte nettsted. Velg rammeverket du bruker.
Demoapper med full CSS og ruting
HTML JavaScript
Vanlige HTML-sider, ren JavaScript, ingen byggeverktøy. Passer på enhver statisk vert — perfekt for små nettsteder og progressiv forbedring.
Svelte + SvelteKit
SvelteKit 3-app som bruker Svelte 5 runes. Komponentruter, filbasert ruting og en stilet storybook for hver komponent.
React + Next.js
Next.js 16-app som viser hver komponent i kontekst, med TypeScript gjennomgående og demosider for sammensatte mønstre.
Vue + Nuxt.js
Nuxt 4-app. <script setup> og Composition API på hver demorute.
Angular + Analog
Angular 22 + Analog.js-app. Filbasert ruting, signaler, soneløs endringsdeteksjon og full SSG-forhåndsgjengivelse.
Blazor Web
Blazor Web-app med Razor-komponenter. Server- og WebAssembly-vennlig, med .NET 10 som baseline.
Nunjucks + Eleventy
Eleventy-nettsted som bruker Nunjucks-makroer. Ideelt for innholdstunge statiske nettsteder som likevel vil ha et ekte komponentsystem.
Hver eksempelapp har samme form
For at det skal føles kjent å hoppe mellom rammeverk, gir hver eksempelapp:
- En velkomstrute på
/som introduserer prosjektet. - En komponentindeks på
/componentssom lister hver komponent. - En demoside per komponent på
/components/<component>. - Ekte CSS — ikke abstrakte designtokener — slik at du kan hente stiler direkte.
- Fungerende tastaturnavigasjon og fokushåndtering rett ut av esken.
Trenger du å se hvordan én komponent er stilet?
Åpne den aktuelle eksempelappen, gå til
/components/<name>, og kopier markup og CSS inn i ditt eget prosjekt. Eksempelappene bruker bevisst vanlig CSS (eller nesten vanlig) slik at du kan tilpasse dem til hvilket system du foretrekker.
Vil du heller ha hodeløst?
Par en hvilken som helst eksempelapp med den tilsvarende hodeløse pakken — de publiserer de samme komponentene uten noen CSS, klare for dine egne designtokener.