Stack Picker

Stack Picker is a single-page tool for assembling a multi-layer architecture by selecting one option per category (frontend framework, styling, runtime, hosting, database, cache, ORM, auth, storage, monitoring). As selections change, the page renders a layered SVG diagram of the chosen stack and generates a system-design prompt ready to drop into an LLM for follow-up scaffolding or critique.

The state lives in a Svelte 5 runes store (`picker.svelte.ts`) backed by `localStorage` for persistence and a hash-based share format so any stack can be linked and reproduced. Tooltips use `@floating-ui/dom`, brand logos come from `simple-icons`, and category cards expand/collapse with keyboard support.

Deployed as a fully static SvelteKit build (Vercel adapter-static), zero backend, dark mode by default with a light toggle. The whole app is the diagram — no signup, no analytics, no waiting room.

The architecture image on this page is itself a Stack Picker diagram of Stack Picker's own stack: Svelte + Tailwind CSS in the Client layer, GitHub Actions + Vercel in the Hosting layer, and every other layer deliberately empty.