Alternativa · Pencil.dev
Melhor alternativa ao Pencil.dev para design.
O Open Design é a alternativa totalmente de código aberto e local-first ao Pencil — um espaço de trabalho de design nativo de agentes que você conduz com o agente de código que você já usa, sua chave, seus arquivos e um design system portátil que você mantém no seu repositório.
O Pencil (pencil.dev) é uma ferramenta de design orientada por agentes da a16z Speedrun que coloca um canvas vetorial estilo Figma dentro da sua IDE e mantém seu design como arquivos JSON .pen no seu repositório, versionados com Git. Um servidor MCP local permite que seu agente de código leia e escreva esses arquivos, então um prompt se torna uma UI editável que você pode entregar a um agente de código para gerar o código de produção. Ele foi lançado publicamente no início de 2026, ultrapassou 100.000 usuários e é genuinamente bom — com a ressalva de que o próprio aplicativo é de código fechado, otimizado primeiro para o Claude e gratuito apenas enquanto está em acesso antecipado.
O Open Design é a alternativa totalmente de código aberto e local-first: um espaço de trabalho de design nativo de agentes para o qual você aponta seu próprio agente de código (Claude Code, Codex, Cursor, Gemini, OpenCode, Qwen) via BYOK. Esses dois são incomumente próximos — ambos orientados por agentes, ambos mantendo o design como arquivos no seu repositório. As diferenças são propriedade e alcance: com o Open Design, o aplicativo inteiro é Apache-2.0 (não apenas um formato documentado), o BYOK é neutro em relação ao provedor, e a saída abrange UI, apresentações, protótipos e um DESIGN.md portátil. Esta página é honesta sobre onde o Pencil genuinamente vence.
01
O que é o Pencil
O Pencil (pencil.dev) é “design no canvas, chega em código” — um canvas de design vetorial infinito que vive dentro da sua IDE e do seu código-fonte, construído por Tom Krcha (anteriormente por trás do Around, adquirido pela Miro) e apoiado pela a16z Speedrun. Seus arquivos de design usam um formato JSON .pen aberto e documentado que fica no seu repositório sob Git, e um servidor MCP local permite que agentes de IA os leiam e escrevam. Você faz prompt ou desenha no canvas, então entrega o design a um agente de código (Claude Code e outros) para gerar componentes de produção que correspondem à sua stack.
Como superfície de design, o Pencil é refinado: um canvas vetorial de verdade com camadas, um inspetor de propriedades, componentes de arrastar e soltar, blocos de prompt que você coloca diretamente no canvas, copiar e colar nativo do Figma que preserva camadas e auto-layout, e kits de UI integrados (Shadcn, Lunaris, Halo, Nitro). Edições manuais no canvas não consomem tokens de agente.
O que saber antes de se comprometer: o aplicativo Pencil é de código fechado (apenas o formato .pen é documentado, e pode mudar), é otimizado para o Claude Code com uma experiência mais fraca em outros modelos, é gratuito apenas no acesso antecipado (“Gratuito não é um modelo de negócio”, segundo os fundadores), e resenhas observam que ele ainda é inicial — travamentos ocasionais e ausência de salvamento automático.
- Fornecedor: Pencil (pencil.dev), a16z Speedrun — aplicativo de código fechado, ~100.000 usuários, lançado no início de 2026
- Runtime: aplicativo de desktop local + extensão de IDE (Cursor / VS Code / Windsurf) + servidor MCP local
- Arquivos de design: formato JSON .pen aberto no seu repositório, versionado com Git
- Modelo: MCP com vários agentes, otimizado para o Claude Code; você traz sua própria assinatura de agente
- Preço: gratuito no acesso antecipado, sem limites publicados ainda — planos pagos sinalizados
02
Open Design vs Pencil, recurso por recurso
| Recurso | Open Design | Pencil (pencil.dev) |
|---|---|---|
| Licença | Apache-2.0 — o aplicativo inteiro é código aberto | Aplicativo de código fechado; apenas o formato .pen é documentado |
| Runtime | Daemon local + aplicativo de desktop | Aplicativo de desktop local + extensão de IDE + servidor MCP local |
| Arquivos de design | Arquivos no seu repositório (Git): DESIGN.md, artefatos | Arquivos JSON .pen no seu repositório (Git) |
| Conta | Nenhuma necessária; roda localmente | Conta / login (acesso antecipado) |
| Preço | Gratuito e código aberto; seu próprio gasto de modelo | Gratuito no acesso antecipado; planos pagos sinalizados |
| Modelo | BYOK, neutro em relação ao provedor — Claude, Codex, Cursor, Gemini, Qwen | MCP com vários agentes, otimizado para o Claude Code |
| Superfície principal | Orientado por agentes (prompt → artefatos) + UI web | Canvas vetorial estilo Figma que você edita diretamente; agente via MCP |
| Saída | UI, landing pages, apresentações, protótipos, design systems | Telas/componentes de UI → código (corresponde ao seu repositório) |
| Design system | DESIGN.md portátil que toda skill aplica | Variáveis/Componentes + kits de UI integrados (Shadcn, Lunaris…) |
| Importação do Figma | Via agente (colar/captura de tela → DESIGN.md) | Copiar e colar nativo (preserva camadas, auto-layout) |
| Colaboração | Usuário único local; orientado por agentes | Sem multiplayer humano; SWARM = múltiplos agentes de IA |
| Auto-hospedar / fork | Sim (Apache-2.0) | Não — o aplicativo é de código fechado |
| Maturidade | Releases estáveis | Acesso antecipado — travamentos, ausência de salvamento automático relatados |
Leia com honestidade: o Pencil vence no canvas manual — uma superfície madura, estilo Figma, que você edita diretamente, com colagem nativa do Figma e kits de UI integrados, bem dentro da sua IDE. O Open Design vence em propriedade e alcance — o aplicativo inteiro é código aberto (não apenas o formato de arquivo), o BYOK é neutro em relação ao provedor em vez de priorizar o Claude, “gratuito” permanece gratuito porque não há fornecedor para monetizá-lo, e a saída abrange UI, apresentações, protótipos e um design system portátil como arquivos que você mantém.
03
Por que as equipes buscam uma alternativa ao Pencil
O Pencil é uma forma poderosa de projetar dentro da sua IDE, e para muitos “desenvolvedores que projetam” é um ótimo encaixe. Os motivos pelos quais as pessoas ainda buscam uma alternativa se agrupam em torno do que acontece depois da lua de mel do acesso antecipado — propriedade, dependência de provedor e escopo.
- O aplicativo é fechado, apenas o formato é aberto: O formato .pen do Pencil é documentado, mas o aplicativo é de código fechado e financiado pela a16z, e a especificação do formato reserva o direito de mudar. O Open Design é Apache-2.0 de ponta a ponta — faça fork, audite, auto-hospede e seja dono de cada artefato que ele produz.
- “Gratuito” tem data de validade: O Pencil é gratuito enquanto está em acesso antecipado, mas os fundadores são explícitos ao dizer que “Gratuito não é um modelo de negócio”. Planos pagos e limites estão chegando. O Open Design é gratuito porque é código aberto; você só paga o seu próprio gasto de modelo.
- Ele prioriza o Claude: O Pencil conecta vários agentes via MCP, mas é otimizado para o Claude Code, com uma experiência mais fraca em outros lugares. O Open Design é BYOK neutro em relação ao provedor — Claude, Codex, Cursor, Gemini, OpenCode e Qwen são todos de primeira classe.
- Você quer mais do que UI-para-código: O Pencil é focado em UI → código. O Open Design renderiza UI, landing pages, apresentações, protótipos e um design system portátil em DESIGN.md a partir da mesma marca, todos como arquivos no seu repositório.
04
Código aberto + BYOK, explicado
Ambas as ferramentas são local-first e mantêm o design como arquivos no seu repositório — essa parte é um ponto em comum. Onde o Open Design difere é que o aplicativo inteiro é Apache-2.0, não apenas um formato de arquivo documentado, então você pode fazer fork, auditar e auto-hospedar. Sua marca vive no seu repositório como um DESIGN.md portátil que toda skill respeita.
Você também traz sua própria chave de agente, neutra em relação ao provedor. As credenciais ficam na configuração local ou em variáveis de ambiente — o Open Design nunca as intermedia — e o gasto de API é cobrado diretamente de você, às taxas do seu provedor, sem nenhum limite de fornecedor depois do acesso antecipado.
Novo nessa ideia? Leia o que é vibe design, explore a biblioteca de plugins e design systems, veja todas as comparações do Open Design — incluindo Figma e Google Stitch — ou baixe o Open Design para experimentar.
05
Onde o Pencil genuinamente vence — e qual escolher
Crédito a quem merece: como superfície de design, o Pencil é excelente. É um canvas vetorial de verdade, estilo Figma, que você edita à mão — camadas, um inspetor de propriedades, componentes de arrastar e soltar, e blocos de prompt colocados diretamente no canvas — com copiar e colar nativo do Figma que mantém camadas e auto-layout, além de kits de UI integrados (Shadcn, Lunaris, Halo, Nitro). E tudo isso vive bem dentro da sua IDE, então um desenvolvedor que projeta nunca sai do Cursor ou do VS Code. Se o que você quer é um canvas refinado para manipular diretamente, a superfície do Pencil é mais madura do que o fluxo agent-first do Open Design hoje. O trade-off é tudo o que é estrutural em torno dele: aplicativo de código fechado, otimização voltada ao Claude e um “gratuito” que os fundadores disseram que não vai durar.
Uma forma rápida de decidir pelo que você realmente quer fazer — os dois se sobrepõem, então a divisão honesta importa:
| Se você quer… | Melhor escolha |
|---|---|
| Ser dono da ferramenta inteira como código aberto que você pode fazer fork/auto-hospedar | Open Design |
| Manter “gratuito” gratuito sem limite de fornecedor depois do acesso antecipado | Open Design |
| Usar BYOK neutro em relação ao provedor (não priorizando o Claude) | Open Design |
| Renderizar UI + apresentações + protótipos + um design system | Open Design |
| Editar um canvas vetorial maduro, estilo Figma, à mão | Pencil |
| Colar do Figma com camadas e auto-layout intactos | Pencil |
| Projetar embutido dentro do Cursor / VS Code | Pencil |
06
Movendo um design do Pencil para o Open Design
Ambas as ferramentas mantêm o design como arquivos no seu repositório, então não há nenhuma exportação de nuvem com perdas para enfrentar — a mudança é design-first. Extraia sua marca uma vez e toda renderização depois a herda.
- Instale o Open Design a partir da página de download e traga sua própria chave de agente (Claude Code, Codex, Cursor, Gemini, OpenCode ou Qwen).
- Aponte seu agente para uma exportação do Pencil, uma colagem do Figma ou uma captura de tela cujo visual você quer manter.
- Peça ao agente para extrair a marca — cores, tipografia, espaçamento — para um arquivo DESIGN.md no seu repositório.
- Escolha uma skill e renderize-a com sua nova marca para confirmar que ela corresponde.
A partir daí, toda skill renderiza com a sua marca — e a UI, o código e o design system permanecem no seu repositório como arquivos que você possui sob controle de versão.
FAQ
Perguntas frequentes
-
01 O Pencil (pencil.dev) é código aberto?
Não o aplicativo. O Pencil é um produto de código fechado, financiado pela a16z; o que é “aberto” é o formato de arquivo .pen, que é documentado mas pode mudar (a equipe reserva o direito de fazer mudanças incompatíveis). O Open Design é totalmente de código aberto sob Apache-2.0 — o aplicativo inteiro, não apenas a especificação do arquivo — e é auto-hospedável.
-
02 O Pencil.dev é gratuito?
É gratuito hoje, mas explicitamente em acesso antecipado. Os fundadores disseram “Gratuito não é um modelo de negócio”, sinalizando futuros planos pagos e limites. O Open Design é gratuito porque é código aberto; você traz sua própria chave de agente, então o gasto de modelo é cobrado de você sem nenhum limite definido pelo fornecedor.
-
03 Qual é a diferença entre o Open Design e o Pencil?
Eles são próximos — ambos são orientados por agentes e mantêm o design como arquivos no seu repositório sob Git. As diferenças: o Open Design é totalmente de código aberto (Apache-2.0, não apenas um formato aberto), BYOK neutro em relação ao provedor (não otimizado principalmente para o Claude) e renderiza uma variedade maior de artefatos (UI, apresentações, protótipos, design systems). O Pencil oferece um canvas vetorial manual mais maduro e colagem nativa do Figma.
-
04 O Pencil funciona com agentes além do Claude?
Sim — ele conecta vários agentes via MCP (Cursor, Windsurf, Codex e outros), mas é otimizado para o Claude Code e resenhas relatam uma experiência mais fraca com outros modelos. O Open Design trata Claude, Codex, Cursor, Gemini, OpenCode e Qwen como de primeira classe.
-
05 O Open Design é afiliado ao Pencil?
Não. O Open Design é um projeto independente de código aberto (github.com/nexu-io/open-design, Apache-2.0). O Pencil é um produto separado, financiado pela a16z, em pencil.dev; esta é uma comparação não afiliada.
Seja dono da ferramenta inteira, não apenas do formato de arquivo.
Dê uma estrela no repositório, baixe o build de desktop ou execute a instalação no seu terminal. O Open Design é código aberto de ponta a ponta — sua UI, seu código e seu sistema DESIGN.md permanecem no seu repositório desde a primeira renderização em diante.