Pencil Logo
BACKED BYSpeedrun

Design Mode
for Cursor

Introducing a new way to design right where you code.

Available soon. Be first to get access.

Pencil in action demonstration
Pencil design tool interface

Design right where you code. No more design handoffs.

Pencil is agent driven MCP canvas built around open design format that lives in your codebase.

CursorCursor
VSCodeVSCode
Claude CodeClaude Code
OpenAI CodexOpenAI Codex
Any IDE of your choice

DESIGN CANVAS

Infinite design canvas

Design your products with pixel-perfect precision without ever leaving your IDE. Code and design are always just one tab-click apart.

AI MULTIPLAYER

A crew of extra hands that's got your back. AI singleplayer is the new multiplayer.

Get extra hands to help you generate screens or entire flows in parallel. Work side by side to explore new directions faster than ever.

AI Multiplayer interface showing parallel design generation

SPEED & PRECISION

Vibe designing
with precision

Prompt entire screens or specific parts directly in context. Use curated actions optimized for speed and quality, or write your own from scratch.

From vectors
to code. Pixel perfect.

Ship production ready apps where code stays true to the design. Pixel perfect context keeps everything aligned. Design and code live under one roof—in your repo.

Pencil
Pencil design interface
Generated HTML/CSS/React code
HTML/CSS/React/<code of choice>

Curated design kits packed in or bring your own

Leverage curated, component based design kits to build beautiful products. Get the craft and taste of a senior designer at your fingertips, or plug in your team's existing design system straight from the codebase.

Curated design kits and components
Fully open file format

Fully open file format

Read, debug, or extend design files with your own tools. No black box, no lock-in.

Bring over designs from Figma

Bring over designs from Figma

Copy and paste designs directly from Figma. Vectors, text, and styles come over intact.

Design as code

Design as code

Design files live in your repo. Version, branch, and merge with git just like you do in development.

The bi-directional MCP vector canvas you've been dreaming about

Pencil doesn't provide just MCP reading tools, but also full write access + many other handy tools to fully operate the canvas. This is the real magic. You can plug-in the whole world of MCPs, bring in data from other sources like databases, APIs, chart data, Playwright/Puppeteer or plugin other agents easily. You are in charge!