150+ LLM-Built HTML/JS Tools for Quick Tasks
Simon Willison's repo showcases 100+ functional web tools generated via LLM prompts (mostly Claude), proving you can build deployable prototypes rapidly with low-stakes prompt-driven development.
Prompt-Driven Development Yields Production-Ready Tools
Build complete HTML+JavaScript tools using LLMs like Claude in one-shot prompts or short conversations—1,106 commits across 150+ tools with 1.5k GitHub stars and 156 forks validate this approach. Each tool is a self-contained page (e.g., image croppers, text processors) hosted at tools.simonwillison.net, demonstrating LLMs handle full-stack logic, UI, and edge cases without manual coding. Use custom Claude instructions (detailed at simonw.net/2024/Dec/19/one-shot-python-tools/#custom-instructions) to enforce clean, copy-pasteable outputs. Colophon at tools.simonwillison.net/colophon reveals exact prompts, transcripts, and commits, letting you replicate or iterate.
Trade-offs: Tools suit narrow, stateless tasks (no databases, simple inputs/outputs); Python counterparts exist in /python/ folder for heavier logic. Low stakes mean no polish needed—focus on speed over perfection, shipping in minutes vs. hours.
Key Tool Categories and Use Cases
Image/Media Processing (12+ tools): Crop for social media (2:1 ratio), compare JPEG qualities, convert PNG/WebP to JPEG, trace to SVG, render SVG to raster, progressive SVG drawing, bbox cropping with coord output, mask visualization, FFmpeg crop commands, TIFF EXIF orientation, in-place avatar cropping, YouTube thumbnail URLs. These handle 90% of ad-hoc media tweaks without desktop apps.
Text/Document Utilities: Alt-text extraction, blog-to-newsletter conversion, animated word clouds, annotated presentations, base64-gzip decoding—streamline content workflows directly in browser.
Social/Data Tools: Bluesky integrations (faves, firehose, quotes, resolve handles, search, threads, timelines), analytics viewers, census data with Claude/Gemini, clipboard backup/viewer—pull and visualize APIs without setup.
UI/Dev Experiments: Animated rainbow borders, arena animations, ARIA live regions, audio spectrum, badge drawers/REPLs, box shadows, broadcast channel chat, click-to-expand grids, token counters for Claude. These test web APIs (e.g., Web Audio, BroadcastChannel) via LLM generation.
Repo structure uses build scripts (build.sh, build_by_month.py) to generate static HTML from .docs.md sources, deployable to Vercel/Netlify.