See Lily for real apps
Seven worked example projects show how to take di headless components, add styling, and ship real website. Pick di framework wey you dey use.
Demo apps with full CSS and routing
HTML JavaScript
Plain HTML pages, vanilla JavaScript, no build tools. E fit enter any static host — perfect for tiny sites and progressive enhancement.
Svelte + SvelteKit
SvelteKit 3 app wey dey use Svelte 5 runes. Component routes, file-based routing, and styled storybook of every component.
React + Next.js
Next.js 16 app wey show each component for context, with TypeScript throughout and demo pages for compound patterns.
Vue + Nuxt.js
Nuxt 4 app. <script setup> and di Composition API across every demo route.
Angular + Analog
Angular 22 + Analog.js app. File-based routing, signals, zoneless change detection, and full SSG prerendering.
Blazor Web
Blazor Web app with Razor components. Server- and WebAssembly-friendly, with .NET 10 baseline.
Nunjucks + Eleventy
Eleventy site wey dey use Nunjucks macros. Perfect for content-heavy static sites wey still want real component system.
Every example app get di same shape
To make framework-hopping feel familiar, every example app provide:
- Welcome route for
/wey introduce di project. - Components index for
/componentswey list every component. - Demo page for each component for
/components/<component>. - Real CSS — no be abstract design tokens — so you fit copy styles directly.
- Working keyboard navigation and focus management out of di box.
You need to see how one component dey styled?
Open di relevant example app, go
/components/<name>, and copy di markup and CSS enter your own project. Di example apps use plain CSS (or near-plain) on purpose so you fit adapt dem to any system wey you like.
You want headless instead?
Pair any example app with im matching headless package — dem publish di same components without any CSS, ready for your own design tokens.