A vector canvas that lives inside your editor and saves its work as files your coding agent can read.
pen.dev — formerly pencil.dev — puts a Figma-like canvas inside Cursor, VS Code and Claude Code, and keeps each design as a .pen file committed next to the code it describes. A local MCP server lets the coding agent read and write those files, so a drawing becomes something an agent can build, and components that already exist can be pulled back onto the canvas. Built by Tom Krcha, previously behind Around, and funded through a16z Speedrun.
- Vector canvas inside your IDE
- Designs stored as files in the repo
- Local MCP server for coding agents
- Pull existing components onto the canvas
- Design tokens synced with code
- Cursor, VS Code and OpenVSX
Recent X Posts
Present mode now has 100% zoom mode. This is great for presenting long websites. We have also added zoom animations for higher comfort when navigating the canvas.
Due to popular demand, we have added Queue and Steering in the chat agent. You can now keep sending message after message and they will be queued in an editable queue. But you can also click "Steer", which will immediately inject the message into the agent's context on the spot without waiting for the turn to finish.
We did a small update to the built-in styles. Check them out. Btw: Even bigger styles update coming later.
Image Crop just landed in @pendev! With Stretch, Fill, Fit, it's the most advanced image crop out there :)