{"slug": "show-hn-sometimes-it-s-faster-to-draw-a-box-with-an-arrow-than-write-a-paragrap", "title": "Show HN: Sometimes it's faster to draw a box with an arrow than write a paragrap", "summary": "A developer released Sketch2AI, a free, open-source HTML drawing board that copies sketches directly to the clipboard for pasting into AI chat interfaces like Claude, enabling users to explain ideas with diagrams instead of text. The tool, available as a single HTML file at hz47.github.io/Sketch2AI, supports boxes, arrows, labels, freehand drawing, image pasting, and an endless canvas with auto-copy, requiring no install, account, or server.", "body_md": "A tiny drawing board that copies whatever you make straight to your clipboard, so you can paste it into Claude (or any chat that accepts images) and explain what you mean with a picture instead of words.\n\nSometimes it is faster to draw a box with an arrow than to describe it in a paragraph. That is the whole idea.\n\nTry it here: [https://hz47.github.io/Sketch2AI/](https://hz47.github.io/Sketch2AI/)\n\n- Draw boxes, ellipses, lines, and arrows for flows and diagrams. Hold Shift to snap to squares, circles, and clean angles.\n- Double-click a box or ellipse to type a label inside it, so a shape becomes a named component.\n- Draw freehand with a pen, or use the highlighter to circle and emphasize parts of a screenshot.\n- Paste a screenshot or copied text right onto the board with Cmd+V, and drag image files in from Finder.\n- Move, resize, duplicate, and layer anything. Drag a box around several items to select them all at once.\n- Work on an endless canvas. Scroll to pan, pinch or Cmd+scroll to zoom, and keep adding content wherever you like.\n- Every time you change something, the visible area of the canvas is copied to your clipboard. Pan and zoom to frame what you want, and that is what gets copied. Then you paste it into Claude.\n\nIt is meant to sit next to the text you write to Claude: draw the thing, paste the picture, and let the words and the sketch explain the idea together.\n\nThere is also a \"Copy now\" button if you turn off auto-copy, and a \"Save PNG\" button that downloads the board as a file.\n\n- Open\n`index.html`\n\nin Chrome (double-click the file, or right-click and choose Open With, then Google Chrome). - Draw something.\n- Switch to Claude and press Cmd+V.\n\nThat is it. No install, no account, no server. It is one HTML file with everything inside it.\n\nOpen the page in Chrome, then go to the menu and pick \"Install page as app\" (older Chrome calls it \"Create Shortcut\" with the \"Open as window\" option). You get a dock icon and its own window.\n\nThe copy feature needs the page to run as a local file or a real website. If you open it inside a sandboxed preview, the browser blocks clipboard access and you will see a \"Copy blocked\" message. Running the local file in Chrome fixes it. If a copy is ever blocked, use the \"Save PNG\" button and drag the file in instead.\n\nPasting an image works in the Claude desktop app and on claude.ai. It does not work in the Claude Code terminal, which only takes text.\n\n`P`\n\npen,`G`\n\nhighlighter,`E`\n\neraser`R`\n\nrectangle,`O`\n\nellipse,`L`\n\nline,`A`\n\narrow`T`\n\ntext,`M`\n\nmove and select`H`\n\npan (or hold Space and drag, or drag with the middle mouse button)`1`\n\nfit everything in view`Cmd +`\n\n/`Cmd -`\n\n/`Cmd 0`\n\nzoom in, out, reset to 100%`Cmd+D`\n\nduplicate the selection`Cmd+]`\n\n/`Cmd+[`\n\nbring to front, send to back`Cmd+Z`\n\nundo the last thing you added`Cmd+C`\n\ncopy the drawing now`Cmd+V`\n\npaste an image or text onto the canvas`Delete`\n\nremove the selected items\n\nPlain HTML, CSS, and JavaScript. No libraries, no build step. The drawing runs on an HTML canvas.\n\nMIT. Do whatever you like with it.", "url": "https://wpnews.pro/news/show-hn-sometimes-it-s-faster-to-draw-a-box-with-an-arrow-than-write-a-paragrap", "canonical_source": "https://github.com/hz47/Sketch2AI", "published_at": "2026-07-23 10:04:22+00:00", "updated_at": "2026-07-23 10:22:41.316731+00:00", "lang": "en", "topics": ["developer-tools", "ai-tools"], "entities": ["Sketch2AI", "Claude", "hz47.github.io"], "alternates": {"html": "https://wpnews.pro/news/show-hn-sometimes-it-s-faster-to-draw-a-box-with-an-arrow-than-write-a-paragrap", "markdown": "https://wpnews.pro/news/show-hn-sometimes-it-s-faster-to-draw-a-box-with-an-arrow-than-write-a-paragrap.md", "text": "https://wpnews.pro/news/show-hn-sometimes-it-s-faster-to-draw-a-box-with-an-arrow-than-write-a-paragrap.txt", "jsonld": "https://wpnews.pro/news/show-hn-sometimes-it-s-faster-to-draw-a-box-with-an-arrow-than-write-a-paragrap.jsonld"}}