Miscellaneous HTML+JavaScript tools I have built, almost all with the assistance of LLMs.
Prompts used are linked to from the commit messages for each tool.
Everything I built with Claude Artifacts this week describes how I built a lot of these.
- OCR for PDF files and images that runs entirely in your browser
- Render Markdown renders Markdown to HTML using the GitHub Markdown API
- Annotated presentation creator to help turn slides into an annotated presentation
- Box shadow CSS generator generates the CSS for a box shadow with interactive settings
- Compare PDFs provides a visual comparison of the pages of two PDF files
- Image resize and quality comparison converts an image to JPEGs using a number of different quality settings so you can select the smallest file size that is still usefully legible (how I built this)
- YouTube Thumbnails - paste in the URL to a YouTube video, get back all of the URLs to thumbnail images of different sizes for that video
- SVG to JPEG/PNG - turn an SVG file into a rendered JPEG or PNG (how I built this)
- Jina Reader - convert any URL to copyable Markdown using the Jina Reader API
- Extract URLs - copy a section from a web page to your clipboard, paste it in here and get back a plain text list of all of the linked URLs from that section
- EXIF Data Viewer - view EXIF data for an image
- MDN Browser Support Timelines - search for web features and view the browser support timeline pulled from MDN
- Timestamp Converter - convert between Unix timestamps and human-readable dates
- Haiku generates Haikus from your camera using Claude 3 Haiku
- Chrome Prompt Playground is a UI for running prompts through the Google Chrome Canary experimental Gemini Nano LLM and saving the results in local storage
- Gemini API Image Bounding Box Visualizer - run prompts against Google Gemini models that return bounding box co-ordinates and visualize them against the original image, see this post for details
- Claude Token Counter - counts the number of tokens in a Claude prompt
- OpenAI audio input - record audio through the microphone and send it to OpenAI's audio model
- OpenAI audio output - run prompts against OpenAI that produce audio output and listen to it or download it from the browser
- Arena animated animates the progression of the LMSYS Chatbot Arena, inspired by this visualization by Peter Gostev (via Time-Winter-4319 on Reddit)
- California Clock Change - shows when the clocks will next change for daylight saving time in California
- Bluesky WebSocket Firehose showing a live firehose of Bluesky activity, described here
On Observable:
- Blog to newsletter helps me turn my blog into a newsletter
- Weeknotes helps me write my weeknotes
- Convert Claude JSON to Markdown for sharing Claude conversation transcripts
- Hacker News homepage with links to comments ordered by most recent first