JSON Canvas skill

Você pede o mapa ou o fluxo em texto e o Claude monta o arquivo .canvas pronto pra abrir no Obsidian, com caixas, setas e grupos no lugar.

por kepano

instalações: 74,6 mil
estrelas no GitHub: 50,1 mil
No skills.sh desde: janeiro de 2026
Licença: MIT

Atualizada no GitHub em 15 de setembro de 2026. Dados conferidos em 26 de outubro de 2026, no skills.sh e no GitHub.

kepano
json-canvas
Você pede o mapa ou o fluxo em texto e o Claude monta o arquivo .canvas pronto pra abrir no Obsidian, com caixas, setas e grupos no lugar.Auditada74,6 mil instalações, grátis

O que ela faz

Ensina o Claude a escrever arquivos .canvas no padrão JSON Canvas 1.0, o formato dos quadros visuais do Obsidian. Ele cria caixas de texto com Markdown, cartões que apontam pra notas e imagens do seu cofre, cartões de link e grupos com nome e cor, e liga tudo com setas que podem ter legenda.

Cuida do que costuma quebrar o quadro: gera um id único pra cada caixa, posiciona os itens sem sobrepor (de 50 a 100 px de espaço, alinhados à grade) e, no fim, confere se toda seta aponta pra uma caixa que existe e se o JSON do arquivo está válido.

Também edita quadros que já existem: lê o arquivo, acha a caixa pelo id, muda texto, cor ou posição e acrescenta conexões novas sem bagunçar o resto.

Nas palavras de quem fez

Create and edit JSON Canvas files (.canvas) with nodes, edges, groups, and connections. Use when working with .canvas files, creating visual canvases, mind…

kepano, no SKILL.md

Quando usar

Transformar um processo de vendas ou de atendimento num fluxograma
Montar um mapa mental de um curso, de um produto ou de ideias de conteúdo
Organizar um projeto num quadro com um grupo por etapa
Juntar notas de pesquisa do Obsidian num quadro com as ligações entre elas

Depois de instalar, é só pedir assim

Cria um canvas com o funil de vendas do meu produto: anúncio, página, checkout e pós-venda, ligados por setas
Monta um mapa mental em mapa-curso.canvas com os módulos e as aulas desse roteiro
No projeto.canvas, junta as tarefas de lançamento num grupo verde e liga cada uma à próxima

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

Gen Agent Trust HubPassou
SocketPassou
SnykPassou

Perguntas

Como instalar a JSON Canvas no Claude Code?

Toca em Levar, aqui nesta página, e deixa seu nome, e-mail e WhatsApp (é uma vez só). Aparece uma frase pronta: cola ela no Claude Code, que ele mesmo instala a JSON Canvas, e a skill passa a valer na próxima conversa. A mesma frase serve no Codex. Se preferir fazer na mão, o passo a passo está em como instalar skills no Claude Code.

Precisa do Obsidian?

Pra ver o quadro, sim, ou de outro programa que abra JSON Canvas. Pra criar, não: o Claude só escreve um arquivo de texto .canvas na pasta. A skill não pede chave de API nem conta paga.

Roda no Codex e no Antigravity?

Sim. É só texto com as regras do formato, e qualquer agente que escreve arquivos consegue usar.

Ela gera imagem ou diagrama em PNG?

Não. Ela gera o arquivo .canvas, que o Obsidian mostra como quadro. Imagem só entra como cartão apontando pra um arquivo que já está no seu cofre.

Levar essa skill

1x json-canvasR$ 0,00

TotalR$ 0,00

Levar precisa do JavaScript ligado. O código da skill está no GitHub: github.com/kepano/obsidian-skills

Aprenda a usar

Claude Cowork no Windows: o que é e como usar
Sim, o Claude Cowork roda no Windows, no app do Claude, em todos os planos pagos. Veja o que ele faz, como instalar e a diferença pro Claude Code.