Tested comparison
Figma, Stitch or Pencil — which design connector do you actually need?
Short answer: they're not rivals. Figma reads your real design system, Stitch generates new screens, Pencil lets Claude edit actual vector files. Confusing them wastes an afternoon; chaining them is the recipe.
| Figma | Stitch | Pencil | |
|---|---|---|---|
| The job | Read your real design system | Generate new screens | Edit real vector files locally |
| Input | A Figma file link | A plain-language screen brief | A .pen file in your editor |
| Output | Exact tokens, specs, structure | Designed screens (variants) | Editable vectors, exports |
| Setup | Remote, sign in (figma.com/mcp-catalog) | npx proxy + Google sign-in | IDE-native, local |
| Watch out | Reads, does not redraw for you | Invents a look unless fed tokens | Refinement tool, not a generator |
The chain beats any single tool
The mistake everyone makes: asking a generator for on-brand screens without giving it the brand. Generators invent hex codes. The working order is extraction first — Figma reads your exact colors and type, Stitch generates with those tokens as hard constraints, Pencil turns the winner into an editable file. Full walkthrough with prompts: on-brand UI from your Figma.
FAQ
Which design connector generates new screens?
Google Stitch. Describe one screen with named elements and it designs it. Feed it your real tokens first (extracted via the Figma connector) or it will invent a look.
Which one reads my existing design system?
Figma — the official remote connector reads your files: exact color styles, text styles, components. It is read/inspect oriented, not a screen generator.
Which one lets Claude edit real design files?
Pencil — an IDE-native vector canvas (.pen files). Claude can read, edit and export them locally. Best for refining a generated screen into something production-ready.
Can I chain them?
Yes — that is the point: Figma extracts your real tokens, Stitch generates constrained by them, Pencil refines the winner. The full chain is our on-brand UI recipe.
Checked 2026-07-12 · based on the tested how-to guides for each connector · curated by Ilya Gindin