
Galeria de prévias
Skills semelhantes
Ver todas as SkillsO que você recebe
- O código-fonte completo do Gráfico de barras de eventos — o arquivo do componente mais um exemplo de uso executável, pronto para colar e editar.
- Um contrato visual por escrito: paleta, escala tipográfica, raio, traço dos ícones e tempos de animação, tudo como tokens que você edita em um só lugar.
- Configuração do gráfico entregue como dados simples — troque pelas suas séries e a camada de gráficos cuida do resto.
Ideal para
- Você precisa de uma visualização de dados em uma página e prefere não configurar uma biblioteca de gráficos.
- Você quer que a paleta e o espaçamento do gráfico combinem com o resto da página.
- Você quer um código-fonte legível que possa editar, e não mais uma dependência para manter atualizada.
Não é para
- Equipes que já usam um design system maduro — esta paleta e esta escala tipográfica vão brigar com as suas.
- Quem quer um pacote npm versionado; isto entrega código-fonte para você mesmo manter.
- Gráficos que precisam de dados em streaming ao vivo ou de rolagem virtualizada em conjuntos muito grandes.
Relatórios para clientes e diretoriaComunicação científica e técnicaWeb design e experiências digitaisCriar infográficoCriar visuais de UICriar página de siteResultado editávelVisual refinadoPara iniciantesNeutro quenteDestaque verde-azuladoFundo generativo
Sobre esta Skill

Você cola um bloco e uma visualização de dados de verdade aparece na página, desenhada direito em vez de rabiscada em SVG. Coloque seus números e as formas se redesenham sozinhas.
O que você recebe
- O código-fonte completo do Gráfico de barras de eventos — o arquivo do componente mais um exemplo de uso executável, pronto para colar e editar.
- Um contrato visual por escrito: paleta, escala tipográfica, raio, traço dos ícones e tempos de animação, tudo como tokens que você edita em um só lugar.
- Configuração do gráfico entregue como dados simples — troque pelas suas séries e a camada de gráficos cuida do resto.
Como usar
- Diga ao seu assistente onde a seção entra: ele lê o seu projeto primeiro e depois escreve o bloco do jeito que esse projeto já é escrito.
- Troque os textos pelos seus. Os tamanhos de fonte e o espaçamento se mantêm sozinhos.
- Troque os números pelas suas séries — o gráfico se redesenha, e as cores e os eixos continuam consistentes.
- Confira no celular antes de publicar. Ele já foi feito para se manter bem ali.
O que você precisa antes de começar
- Dependências
- ECharts — obrigatório
- Último teste
- v1.0.3 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Avaliações dos usuários
Carregando avaliações…







