Button Maker

A standalone version of the button-design app, extracted from Claude.

Running it

You'll need Node.js (18+) installed.

npm install
npm run dev

Then open the URL it prints (usually http://localhost:5173).

To build a static production bundle instead:

npm run build
npm run preview   # serves the built files locally to test them

The dist/ folder from npm run build is a plain static site — you can host it anywhere that serves static files (Netlify, Vercel, GitHub Pages, S3, your own server, etc.).

What's different from the Claude version

• Saved designs now live in this browser's localStorage (see src/storageShim.js) instead of Claude's built-in storage. They're per-browser, not synced anywhere, and will be lost if the user clears their browser data.
• PDF export (Print button) still works the same way — it loads html2canvas and jsPDF from cdnjs.cloudflare.com at runtime the first time you use it, so an internet connection is needed for that specific feature (everything else works fully offline once the page has loaded).
• Fonts: the app pulls a couple of Google Fonts (Comic Neue, Dancing Script) via a CSS @import, so those two specifically also need internet access to render correctly; the rest are system fonts.

Project structure

index.html          Vite entry HTML
src/main.jsx         Mounts the app
src/storageShim.js   localStorage-based polyfill for window.storage
src/ButtonMaker.jsx  The actual app (unchanged from the Claude artifact)