Brilliant vs Pencil (pen.dev)
Pencil, the design canvas from pencil.dev, is now called pen.dev. The two tools are close cousins: a vector canvas, design files as text in your repository, and coding agents that work on the canvas over MCP. Choose pen.dev if you want the canvas inside your IDE, on Linux, or running headless in CI. Choose Brilliant if you want your agent on the canvas every day on a free plan, an editor in the browser, and a Figma import that brings a file’s pages, variables and libraries in one run.
Should I choose Brilliant or pen.dev?
Both are built for people who design with a coding agent. The difference is where each one lives and what the free plan lets your agent do.
| Choose Brilliant if | Choose pen.dev if |
|---|---|
| Your agent designs with you daily and you want that on the Free plan | You want the canvas as an extension inside VS Code or Cursor |
| You are moving real Figma files, with variables and team libraries | You work on Linux, or want a headless CLI for scripts and CI |
| You want the editor in a browser tab, and a team on one canvas live | You want several agents working on a design in parallel |
| You need component sets with variants and tokens with modes and brands | You want to import a live web page as editable layers |
How do Brilliant and pen.dev compare?
Each row on the pen.dev side links to the pen.dev page it was read from.
| What | Brilliant | pen.dev |
|---|---|---|
| What it is | A professional vector design tool that agents work in, on the same canvas as you | "A design editor where you can work with AI agents on a canvas, refine designs manually, and export them to code" (pen. |
| Runs on | macOS, Windows and the web | A desktop app for macOS, Windows and Linux, an extension for VS Code and Cursor, and a command line tool (pen. |
| Editing by hand | Pen and pencil tools, live booleans, auto layout, components, text, effects | Frames with flex layout, shapes, a pen tool with point editing, text, gradients and effects (drawing and editing) |
| Design systems | Component sets with variants, plus tokens with modes and brands | Components with instances and slots, variables and themes, shared as library files (design libraries) |
| Your own agent | Claude Code, Cursor, Codex and more connect over MCP. Unlimited canvas work on Free | Claude Code, Codex, Gemini CLI and others (installation) connect over a local MCP server (AI integration) |
| Agent use on the free plan | Unlimited canvas work for your own agents. Images use your Brilliant AI usage | "5 days / month designing with an agent for free". A day counts "whether the agent is inside pen. |
| AI you can use | Brilliant AI, or your own provider | Hosted models, or your own subscription or API key (pen. |
| From Figma | The plugin imports a whole file: pages, components, variables as a design system, team libraries. Send to Figma goes back | Import a .fig file in the desktop app, choosing which page to import, or copy and paste layers. Pasting does not bring images (import and export) |
| Export | PNG, JPEG, WebP, SVG, PDF, HTML and React, plus MP4, MOV and Replay video on desktop (MOV on macOS only) | PNG, JPEG, WEBP, PDF and SVG, plus HTML with Tailwind or CSS (import and export) |
| Files | Blueprint: plain text, one element per line, on your disk and in git | .pen: a JSON-based file kept in git beside your code (.pen files), with a published schema (the .pen format) |
| Sharing | Publish a project, invite people and edit together in real time | A snapshot link people view in a browser, with comments (sharing) |
When is Brilliant the better pick?
Three situations, each one something you can check in the docs.
Your agent is on the canvas every day
pen.dev’s Free plan includes 5 days a month of designing with an agent, and those days count when you connect your own Claude Code over MCP (pen.dev pricing). In Brilliant, canvas work for your own agents is unlimited on every plan, Free included. See Connect your agent and Plans and billing.
You are bringing real work from Figma
Run the Brilliant plugin in a Figma file and the whole file comes across: pages become canvases, variables become a design system your layers stay bound to, and team libraries can stay connected. Import the same file again and the project updates in place. Send to Figma takes a design back as native layers. pen.dev’s docs describe choosing a page of a .fig file to import, and recreating Figma variables by asking an agent (import and export, variables). See Import from Figma.
You want the browser, and a team on one canvas
Brilliant’s editor also runs in a browser tab with nothing to install, and published projects are edited together in real time. See Collaboration and Teams.
What does pen.dev do better today?
pen.dev is a serious tool, and it leads in several places.
Inside your IDE. An extension for VS Code and Cursor puts the canvas beside your code (installation). Brilliant is its own app, on the desktop and the web.
Linux. pen.dev ships a Linux desktop app (downloads). Brilliant runs on macOS, Windows and the web.
Headless. A command line tool "runs the same editor engine as the desktop app and IDE extension, fully headless" (pen.dev CLI).
Parallel agents. Up to three agents work in parallel on Pro and up to six on Ultra (pen.dev pricing).
Web pages in. Import a web page, including a localhost URL, as editable layers (import and export).
Comments. Reviewers can comment on a shared design (sharing).
A lower price on annual billing. Pro is $16 per user a month billed annually (pen.dev pricing).
What do they cost?
Both have a free plan with the full editor. They differ in how agent use is counted.
| What | Brilliant | pen.dev |
|---|---|---|
| Free | Brilliant AI every month, every design feature, public projects and drops, 2 GB | $0: the full editor, 5 days a month designing with an agent, and 25 image and SVG generations a month (pen. |
| One person | Personal $20 a month, Pro $50, Max $100, Max 20x $200 | Pro $16 per user a month on annual billing, with agents every day (pen. |
| Teams | Seats from $25 a month, 2 seats minimum, 1 TB pooled | Ultra $48 per user a month on annual billing, with team workspaces. Enterprise is custom (pen. |
For every Brilliant plan, see the pricing page.
Can I move a design between them?
SVG is the bridge today. Export from pen.dev as SVG and import it into Brilliant, where paths become vectors, groups become frames and text stays text. See Import and export. There is no direct .pen import.
Common questions
Is pencil.dev now pen.dev?
Yes. pencil.dev redirects to pen.dev, and the site says "pencil.dev is now pen.dev" (pen.dev). The MCP server is still named pencil (AI integration).
Is pen.dev free?
There is a Free plan at $0 with the full editor. It includes 5 days a month of designing with an agent, and paid plans start at $16 per user a month on annual billing (pen.dev pricing).
How does Pencil compare with Figma?
pen.dev is a vector design tool (pen.dev docs) that keeps files as JSON you can track with Git and works with AI agents (pen.dev FAQ). Figma is a cloud design platform. Brilliant sits near pen.dev on that map, and we compare it with Figma here: Brilliant vs Figma.
Do both work with Claude Code?
Yes. pen.dev lists Claude Code among its MCP clients (AI integration). Brilliant connects to Claude Code with one toggle. See Claude Code setup.
Can I keep design files in git with both?
Yes. pen.dev uses JSON .pen files and Brilliant uses Blueprint .bl files, and both are tracked like code (.pen files). See Blueprint files.
Where next?
Try Brilliant in your browser, no account needed: open the playground.
Connect a coding agent: Connect your agent.
Read how the file format works: Blueprint files.
Compare the HTML canvas: Brilliant vs Paper.
Compare the design tool most teams know: Brilliant vs Figma.
See every plan on the pricing page.
pen.dev facts come from pen.dev, its pricing page, FAQ and docs.pen.dev, each linked where it is used, and were read on November 11, 2026. Tell us if something has moved.