Forkshop mounts a sidebar and an infinite canvas inside your Next.js dev server. Your pages, components, and design tokens render on the canvas as iframes — at multiple viewports, side-by-side. Click text in any tile to edit it; ⌘↵ saves to source. When an agent edits a file your canvas is showing, you see it land in real time.

What you get

• A canvas at /forkshop in your dev server. The sidebar lists the Boards you've composed; the canvas renders the active one.
• Live text editing across iframes. The source file changes on disk; Next.js HMR picks it up.
• An activity feed for coding agents. Edits and reads highlight on the canvas in the agent's color.
• Production tree-shakes the editing overlay and 403s the dev-only routes. Forkshop is a dev tool — it doesn't ship to users.

Who it's for

• Developers who want a "design board" view of their app without maintaining a parallel design file.
• Teams using a coding agent (Claude Code, Cursor) who want a visual surface to watch the agent's work.
• Projects whose design system lives in code already — Tailwind, shadcn/ui, or your own primitives.

How it sits next to Figma and Storybook

Figma renders a separate file you keep in sync by hand. Storybook renders components in a sandbox detached from your real routes. Forkshop renders your real routes at your real viewports, in your real dev environment — and the text on the canvas is the text in your source files.