Miscellaneous HTML+JavaScript tools built mostly with the help of LLMs. See also /python/ for tools written using Python.
This collection is an experiment in prompt-driven development with very low stakes.
The colophon lists commit messages and transcripts for every tool.
The code lives in simonw/tools and many tools used the Claude custom instructions described here.
- Social media cropper crop images to 2×1 for social sharing
- Image resize and quality comparison compare JPEG quality settings
- Image to JPEG convert PNG or WebP files to JPEG
- Image to SVG trace bitmap images to SVG paths
- SVG to JPEG/PNG render an SVG to a raster image
- SVG sandbox display decoded SVG files safely
- SVG progressive render watch an SVG draw itself
- BBox cropper draw bounding boxes and read the coordinates
- Mask visualizer inspect JSON masks with bounding boxes
- FFmpeg crop helper generate FFmpeg commands for cropped videos
- TIFF orientation viewer inspect EXIF orientation metadata
- Avatar web component upload and crop avatars in place
- YouTube Thumbnails list thumbnail URLs for a video
- OCR recognize text from images and PDFs in your browser
- PDF OCR run optical character recognition on uploaded PDFs
- Compare PDFs visualize differences between two PDFs
- Render Markdown convert Markdown to HTML using the GitHub API
- HTML preview type HTML on the left and see it rendered on the right
- RTF to HTML inspect RTF clipboard data and convert it to HTML
- Markdown math live preview of Markdown with LaTeX equations
- Footnotes experiment demo linking footnotes to popups
- Reading time calculator estimate how long text will take to read
- Word counter count words across multiple text blocks
- Text wrap balance nav explore the
text-wrap: balanceproperty - Navigation for headings generate an ID-based table of contents
- Paste rich text inspect HTML and plain text on your clipboard
- Paste HTML subset see which tags survive HTML sanitization
- Clipboard viewer debug everything stored in your clipboard
- Extract URLs pull a list of links from pasted HTML
- JSON to Markdown transcript convert transcript JSON to Markdown
- JSON to YAML convert between JSON and YAML formats
- YAML Explorer browse YAML documents in a collapsible tree
- JSON schema builder visually design a JSON schema
- Incomplete JSON printer pretty print partial JSON documents
- PHP Deserializer turn serialized PHP into JSON
- SQL Pretty Printer reformat SQL queries for readability
- Pipfile.lock parser extract dependency versions from
Pipfile.lock
- Timestamp Converter convert Unix timestamps to readable dates
- Timezones compare times across multiple time zones
- Date calculator count days between dates or only weekdays
- Transfer time estimator work out how long file transfers will take
- Token usage calculator summarize LLM token logs by model
- LLM prices redirect quick link to the latest model pricing site
- CSV marker map plot markers on a map from a CSV file
- Species observation map browse recent iNaturalist sightings
- GitHub API write upload text or images directly to a repo
- GitHub issue viewer fetch GitHub issues and comments
- GitHub issue to Markdown turn an issue thread into Markdown
- Zip/Wheel explorer view the contents of Python wheels and zips
- Ares phonetic alphabet convert text to the ARES emergency phonetic code
- Code with Claude 2025 prototype workflow for Claude coding
- Side panel dialog demo experiment with the HTML
dialogelement - Broadcast channel chat chat across tabs using BroadcastChannel
- Bluesky WebSocket Firehose watch real-time activity on Bluesky
- Bluesky resolve DID convert a handle like
simonwillison.netinto a DID - Bluesky timeline view a user’s recent posts and replies
- Bluesky thread export save a Bluesky thread to Markdown
- Bluesky quote finder find all quotes of a Bluesky post
- Event planner rough schedule planner stored in localStorage
- Passkeys demo experiment with browser-based passkey authentication
- Haiku generate haikus using Claude Haiku and your webcam
- Chrome Prompt Playground run prompts on Chrome’s Gemini Nano
- Gemini bounding box visualizer visualize bounding boxes returned by Gemini
- Gemini chat client simple chat UI for the Gemini API
- Gemini mask visualizer overlay segmentation masks from Gemini
- Gemini image JSON renderer display images from Gemini JSON output
- Claude Token Counter count tokens for Claude prompts
- OpenAI audio input record and send audio to OpenAI models
- OpenAI audio output generate speech with OpenAI voices
- OpenAI WebRTC demo interact with OpenAI’s real-time audio API
- GPT-4o Gist audio player play audio responses stored on GitHub Gist
- JSON schema builder build JSON schemas with a visual editor
- Arena animated animated chart of the LMSYS Chatbot Arena
- California Clock Change see when daylight saving time changes
- Open Sauce 2025 schedule browse the upcoming conference sessions
- OpenFreeMap demo MapLibre demo with random points in San Francisco
- Progress of the US presidency track days elapsed in the current term
- User Agent display show your browser’s user agent string
- Encrypt / decrypt message share short encrypted messages
- ARIA live regions demo of dynamic page announcements
- Prompts.js small library for nicer JavaScript prompts
- APSW SQLite query explainer explain SQLite queries using APSW
On Observable:
- Blog to newsletter helps turn blog posts into a newsletter
- Convert Claude JSON to Markdown for sharing Claude transcripts
- Hacker News homepage with links to comments ordered by most recent first