Pular para o conteúdo
Skillpedia
Automações77 mil · #1250

html-to-image-automation

Ajuda seu agente a transformar código HTML em imagens. Útil para criar pré-visualizações ou conteúdo visual.

O que ela faz

Esta ferramenta transforma código HTML em imagens. Ela usa um sistema chamado Rube MCP para encontrar e executar as funções necessárias.

Quando usar

  • ✓Quando você precisa criar imagens a partir de um design feito em HTML.
  • ✓Para automatizar a criação de capturas de tela de páginas web.
  • ✓Ao gerar visualizações de dados ou gráficos que foram codificados em HTML.

Exemplo do que pedir para a IA

“Transforme este código HTML em uma imagem: `<html><body><h1>Olá Mundo</h1></body></html>`”

Quer saber mais? Abra as seções abaixo.

Como usar

O jeito mais fácil: copie a mensagem abaixo e cole no Claude, ChatGPT, Cursor ou outra IA. Ela lê a skill e segue as instruções.

Link da skill

https://github.com/ComposioHQ/awesome-claude-skills/blob/master/composio-skills/html-to-image-automation/SKILL.md

Mensagem pronta para colar

Use esta skill para me ajudar: https://github.com/ComposioHQ/awesome-claude-skills/blob/master/composio-skills/html-to-image-automation/SKILL.md Leia o arquivo SKILL.md desse link e siga as instruções dele na minha tarefa.
Como funciona

Primeiro, o sistema procura as ferramentas certas para transformar HTML em imagem. Depois, ele verifica se a conexão com essas ferramentas está ativa. Por fim, ele usa a ferramenta encontrada para criar a imagem a partir do seu código HTML.

Instalação

Jeito mais fácil: copie o link da skill e cole no Claude, ChatGPT ou Cursor pedindo para seguir as instruções.

No terminal (Claude Code, Codex, Cursor), na pasta do projeto:

npx skills add ComposioHQ/awesome-claude-skills --skill html-to-image-automation

Ou baixe só o arquivo:

curl -L https://raw.githubusercontent.com/ComposioHQ/awesome-claude-skills/master/composio-skills/html-to-image-automation/SKILL.md -o SKILL.md
Conteúdo técnico (SKILL.md)

Tradução do texto original do autor no GitHub. Os comandos e códigos estão como no original.

Automação de HTML para Imagem via Rube MCP

Automatize operações de HTML para Imagem através do kit de ferramentas HTML para Imagem da Composio via Rube MCP.

Documentação do kit de ferramentas: composio.dev/toolkits/html_to_image

Pré-requisitos

  • O Rube MCP deve estar conectado (RUBE_SEARCH_TOOLS disponível)
  • Conexão ativa de HTML para Imagem via RUBE_MANAGE_CONNECTIONS com o kit de ferramentas html_to_image
  • Sempre chame RUBE_SEARCH_TOOLS primeiro para obter os esquemas de ferramentas atuais

Configuração

Obter o Rube MCP: Adicione https://rube.app/mcp como um servidor MCP na configuração do seu cliente. Nenhuma chave de API é necessária — basta adicionar o endpoint e funciona.

  1. Verifique se o Rube MCP está disponível confirmando que RUBE_SEARCH_TOOLS responde
  2. Chame RUBE_MANAGE_CONNECTIONS com o kit de ferramentas html_to_image
  3. Se a conexão não estiver ATIVA, siga o link de autenticação retornado para completar a configuração
  4. Confirme se o status da conexão mostra ATIVA antes de executar quaisquer fluxos de trabalho

Descoberta de Ferramentas

Sempre descubra as ferramentas disponíveis antes de executar fluxos de trabalho:

RUBE_SEARCH_TOOLS
queries: [{use_case: "Html To Image operations", known_fields: ""}]
session: {generate_id: true}

Isso retorna os slugs das ferramentas disponíveis, esquemas de entrada, planos de execução recomendados e armadilhas conhecidas.

Padrão de Fluxo de Trabalho Principal

Etapa 1: Descobrir Ferramentas Disponíveis

RUBE_SEARCH_TOOLS
queries: [{use_case: "your specific Html To Image task"}]
session: {id: "existing_session_id"}

Etapa 2: Verificar Conexão

RUBE_MANAGE_CONNECTIONS
toolkits: ["html_to_image"]
session_id: "your_session_id"

Etapa 3: Executar Ferramentas

RUBE_MULTI_EXECUTE_TOOL
tools: [{
  tool_slug: "TOOL_SLUG_FROM_SEARCH",
  arguments: {/* schema-compliant args from search results */}
}]
memory: {}
session_id: "your_session_id"

Armadilhas Conhecidas

  • Sempre pesquise primeiro: Esquemas de ferramentas mudam. Nunca codifique slugs ou argumentos de ferramentas sem chamar RUBE_SEARCH_TOOLS
  • Verificar conexão: Verifique se RUBE_MANAGE_CONNECTIONS mostra o status ATIVA antes de executar ferramentas
  • Conformidade de esquema: Use nomes de campos e tipos exatos dos resultados da pesquisa
  • Parâmetro de memória: Sempre inclua memory nas chamadas de RUBE_MULTI_EXECUTE_TOOL, mesmo que vazio ({})
  • Reutilização de sessão: Reutilize IDs de sessão dentro de um fluxo de trabalho. Gere novos para novos fluxos de trabalho
  • Paginação: Verifique as respostas em busca de tokens de paginação e continue buscando até que esteja completo

Referência Rápida

Operação Abordagem
Encontrar ferramentas RUBE_SEARCH_TOOLS com caso de uso específico de HTML para Imagem
Conectar RUBE_MANAGE_CONNECTIONS com o kit de ferramentas html_to_image
Executar RUBE_MULTI_EXECUTE_TOOL com slugs de ferramentas descobertas
Operações em lote RUBE_REMOTE_WORKBENCH com run_composio_tool()
Esquema completo RUBE_GET_TOOL_SCHEMAS para ferramentas com schemaRef

Potencializado por Composio

Perguntas frequentes

O que é Rube MCP?

É um sistema que ajuda a IA a encontrar e usar outras ferramentas, como a de transformar HTML em imagem.

Preciso instalar algo?

Você precisa adicionar um endereço específico (endpoint) nas configurações do seu cliente de IA para que ele possa se conectar ao Rube MCP.

Como sei se está funcionando?

O sistema verifica se a conexão está 'ACTIVE' (ativa) antes de tentar criar a imagem. Se não estiver, ele te dará um link para completar a configuração.

Detalhes

Descrição original do autor

Automate Html To Image tasks via Rube MCP (Composio). Always search tools first for current schemas.

repo: ComposioHQ/awesome-claude-skills

Popularidade

Estrelas no GitHub
77 mil
Posição no ranking
#1250
Licença
—
Atualizada em
18/09/2026

Essa skill é útil?

0

Entre para votar.

Comentários

  • …

Mais skills deste repositório

Skills parecidas