Skip to content

sketch anything

the live scratchpad for

teams designing with agents

Scratchpad building a screen on the canvas

Connects to Claude Code, Cursor, Windsurf and anything that speaks MCP

claude code

cursor

windsurf

zed

in the private beta, drawing every day at

  • Northsound
  • Halide Studio
  • Meridian
  • Field Notes
  • Postscript
  • Atlas & Co

02 — THE EXPORT

design to code, and back again

The export panel is not a generator guessing at your intent. It prints the tree you are looking at — HTML, React or Tailwind — and the numbers come out the same to the hundredth of a pixel.

Export — scratchpad.design

The export panel printing the selected artboard as HTML
  1. 01

    three targets, one tree

    HTML with inline styles, React components, or Tailwind classes — switch the tab, not the design.

  2. 02

    paste HTML back in

    Drop markup onto the canvas and it renders as editable layers. The loop closes both ways.

  3. 03

    zero drift, by construction

    The renderer and the exporter read the same style function, so they cannot disagree.

05 — THE SURFACE

live on the canvas, not an image

Thirty GPU shaders sit on the canvas as ordinary layers. Every tile below is running right now — resize it, restyle it, put type on top of it, and it stays a shader all the way through to the export.

  • swirl

    60 fps

  • god rays

    60 fps

  • liquid metal

    60 fps

  • paper texture

    60 fps

  • metaballs

    60 fps

  • dithering

    60 fps

CLOSE THE LOOP

stop redlining.

start sketching.

One canvas for the people and the agents, built on the only layout engine everyone already agrees on.

  • macOS 13+
  • MIT licensed
  • no account needed