I made a skill that lets Claude Code draw architecture diagrams that look sketched in pencil

I kept wanting quick “whiteboard” diagrams for design docs without the polished-corporate look, so I built penciled : an agent skill that turns a short JSON description into a diagram drawn like a 2B pencil on paper. Tapered strokes, hatched shading, corners that overshoot, handwritten labels. It was built entirely with Claude Code: it wrote the renderer, layout engine, validator and tests from a milestone plan I set, and it checked the pencil look by rendering screenshots in a headless browser and critiquing them until I signed off on each stage. And it checks its own work . Before drawing, it lays the diagram out exactly as it will be drawn and warns about crossing arrows, overlaps, crowded labels and so on, with a suggested fix for each. So the agent can fix its own diagram before you ever see it. Install: npx skills add himanshu13ps/penciled (works with Claude Code, Cursor, Codex and other agents that read skills) Then just ask: “sketch the architecture of this repo as a hand-drawn diagram” Outputs SVG, PNG, or a single offline HTML page where you can redraw, change paper and pencil, and zoom No dependencies beyond Node 18. Free, MIT licensed. There’s a browser playground if you want to try it without installing anything: himanshu13ps.github.io/penciled Code: github.com/himanshu13ps/penciled Feedback very much welcome.