Web Tools

A collection of simple, standalone HTML tools for everyday tasks. Each tool is a single HTML file with no build process required.

Inspired by Simon Willison's tools. See also Useful patterns for building HTML tools.

Tools

• AI Context Decision Tree: An interactive decision tree to help you choose the right AI context mechanism (steering files, skills, hooks, MCP servers, etc.) for your use case.
• Article to Markdown: Pull the text of any blog post or article as clean Markdown. Preview the extraction, strip images and link clutter, then copy or download — perfect for feeding references to AI agents. Includes a bookmarklet (and a paste-HTML option) for pages that block proxy fetching.
• Coffee Ratio Calculator: A simple, beautiful coffee ratio calculator to find the perfect coffee-to-water ratio for your brew strength and serving size.
• Color Converter: Convert colors between HEX, RGB, HSL, and other formats. Supports multiple color spaces with live preview.
• Contact Catalog: Validate, view, and manage a contact list exported from a phone as a .vcf file. Flags missing names, malformed numbers/emails, and duplicates, with inline editing and VCF/CSV export.
• CSV Preview: Open a CSV file straight from disk and read it as a tidy greenbar table. Sort, filter, and watch it refresh when the file changes (Chrome/Edge). The file is never converted or saved.
• GitHub Social Preview: View the social preview image for any GitHub repository. See how your repo will appear when shared on social media.
• Markdown Print: Drop a Markdown file or folder to render it as a beautifully typeset page (Tufte-inspired typography) with image support, ready for printing to PDF. Press Esc to return.
• Pie Calculator: Allocate new cash to rebalance your portfolio toward target weights. Interactive calculator for portfolio rebalancing with visual donut chart and allocation recommendations.
• QR Code Generator: Generate QR codes from any text or URL, entirely in the browser. Choose error correction, colors, and export size, then copy or download a crisp high-resolution PNG or SVG.
• Repo Archiver: Scan your GitHub repos, score them for staleness, and archive the ones collecting dust. A visual repo cleanup tool.
• Sailwind Stats: Combined dashboard showing npm downloads (prototyping template) and jsDelivr token requests (mockup skill) for the Sailwind design system.
• Screenshot Generator: Create beautiful screenshots with customizable window frames, backgrounds, shadows, and padding. Paste, drop, or upload images to generate styled screenshots instantly.
• Session to Markdown: Drop an exported Kiro session zip, folder or messages.jsonl to get a readable Markdown transcript. Toggle tool calls and thinking, then copy or download. Runs entirely in the browser.
• Typographer's Palette: A quick-reference for curly quotes, dashes, and special characters. Click any symbol to copy its HTML entity to your clipboard.

Philosophy

These tools are designed to be:

• Simple: Each tool does one thing well
• Standalone: No dependencies, no build process (except where external libraries add value)
• Shareable: Just open the HTML file in a browser or share the URL

Usage

You can use these tools in several ways:

1. Online: Click the tool links above
2. Local: Download any HTML file and open it in your browser
3. Fork: Clone this repo and modify the tools for your needs

License

MIT License - see LICENSE file for details