Pasteables

A Next.js (App Router) web app (originally the "Vector Shelf" artifact): a one-page sticker-shop style homepage (hero collage, bento pack cards, manifesto) whose pack cards open galleries of copy-ready SVG characters. Browsing is open; copying needs a Google sign-in (Firebase Authentication). node scripts/build-landing.mjs rebuilds the small sticker set used on the homepage collage, with live Color / Style / Stroke / Eyes / Ink controls and copy-as SVG, React or Flutter.

Run

npm install
npm run dev     # http://localhost:3000
npm run build && npm start

Deploy to Vercel

Push the folder to a Git repo and import it in Vercel (framework is auto-detected), or run npx vercel. No env vars or config needed; the home page is fully static.

Layout

• app/ layout (next/font for Montserrat, Bricolage Grotesque, DM Sans), page, global CSS

• components/Shelf.tsx hero stripes, hash deep links (/#mascot), Escape to close, toast

• components/GalleryView.tsx studio controls and tile grid

• lib/transform.ts recolour, outline, stroke, eye-scale and SVG/React/Flutter export helpers

• data/*.json the SVG data. Each gallery is a lazy chunk loaded on hover/click, so the home page stays small

• scripts/extract.mjs the one-off script that turned the original artifact HTML into data/

• node scripts/mushroom/build.mjs builds the Mushroom Buddy set (scripts/mushroom/mushroom.mjs, 17 reactions on one base character, scripts/mushroom/base.svg)