Silk Ui
shadcn inspired UI components for sveltekit
Silk UI (WIP)
Svelte components that feel designed, not generated.
40 styled components, a live theme studio, and a token system.
Components
40 shipping. Every one is themed end-to-end and respects prefers-reduced-motion.
| Layout | Forms | Overlay | Feedback | Navigation | Data |
|---|---|---|---|---|---|
| Accordion | Button | Alert Dialog | Alert | Breadcrumb | Avatar |
| Card | Checkbox | Combobox | Badge | Pagination | Calendar |
| Collapsible | Color Picker | Command | Progress | Tabs | Marquee |
| Scroll Area | Combobox | Context Menu | Skeleton | ||
| Separator | Input | Dialog | Toast | ||
| Sheet | Label | Dropdown Menu | Tooltip | ||
| Radio Group | Hover Card | ||||
| Select | Modal | ||||
| Slider | Popover | ||||
| Switch | Sheet | ||||
| Textarea | Shortcut | ||||
| Toggle | |||||
| Toggle Group |
Repository layout
silk/
├── apps/
│ ├── docs/ # SvelteKit docs site + theme studio
│ └── registry/ # Elysia + Prisma API serving themes from Supabase
├── packages/
│ └── silk/ # Canonical component source (consumed by apps/docs via the @silk/ui alias)
├── docker-compose.yml
├── turbo.json
└── package.json # Bun workspaces + Turborepo
Development
bun install # install everything
bun run dev # turbo runs docs + registry in parallel
bun run check # type-check all workspaces
bun run build # production build (adapter-node for docs)
Editing a component in packages/silk/src/components/… is live in the docs site via the
@silk/ui alias (apps/docs/svelte.config.js) — Vite picks the change up immediately.
Production deploy (self-hosted)
The repo ships with a docker-compose.yml that builds both apps and runs them on the same
host. Provide apps/registry/.env with Supabase DATABASE_URL + DIRECT_URL
(see apps/registry/README.md), then:
docker compose up --build -d
The docs site listens on :3000 and the registry on :4100.
License
MIT © Aidan Neel.
