Categorias

Capturador de Sites Web

Gera capturas de tela de alta qualidade de sites web com opções personalizáveis usando navegador sem cabeça

Fatos principais

Categoria
Development
Tipos de entrada
text, number, select, checkbox, textarea
Tipo de saída
file
Cobertura de amostras
4
API disponível
Yes

Visão geral

O Capturador de Sites Web é uma ferramenta eficiente que utiliza um navegador sem cabeça para gerar capturas de tela de alta qualidade de qualquer página da internet, oferecendo controle total sobre o formato, dimensões e elementos visuais.

Quando usar

  • Para arquivar o design de um site ou monitorar alterações visuais ao longo do tempo.
  • Para criar prévias de páginas web em relatórios, apresentações ou portfólios profissionais.
  • Para automatizar a geração de imagens de sites sem a necessidade de capturas manuais.

Como funciona

  • Insira a URL da página que deseja capturar no campo principal.
  • Ajuste as configurações como largura, altura, formato da imagem e modo escuro conforme sua necessidade.
  • Utilize o campo de seletores CSS para ocultar elementos indesejados, como banners de cookies ou pop-ups.
  • Clique em processar para que o navegador sem cabeça renderize a página e gere o arquivo de imagem final.

Casos de uso

Documentação técnica e arquivamento de versões de sites.
Criação de ativos visuais para apresentações de marketing e análise de concorrência.
Testes de interface para verificar como o layout se comporta em diferentes resoluções.

Exemplos

1. Captura de Landing Page para Portfólio

Designer Web
Contexto
Um designer precisa exibir seus projetos recentes em um portfólio online, mas as páginas são muito longas.
Problema
Capturar a página inteira de forma limpa, sem elementos de interface do navegador.
Como usar
Insira a URL do projeto, marque 'Captura de Tela Completa' e selecione o formato PNG para máxima qualidade.
Resultado
Uma imagem única e de alta resolução contendo todo o layout da página, pronta para ser exibida no portfólio.

2. Monitoramento de UI em Modo Escuro

Desenvolvedor Front-end
Contexto
O desenvolvedor está implementando um tema escuro e precisa validar o contraste de todos os componentes.
Problema
Verificar rapidamente como o site se comporta no modo escuro sem alternar manualmente as configurações do sistema.
Como usar
Insira a URL, ative a opção 'Modo Escuro' e defina as dimensões para desktop.
Resultado
Uma captura de tela precisa do site renderizado em modo escuro, facilitando a revisão visual dos estilos CSS.

Testar com amostras

image

Hubs relacionados

FAQ

Quais formatos de imagem são suportados?

A ferramenta suporta os formatos PNG (sem perdas), JPEG (comprimido) e WebP (moderno).

Posso capturar a página inteira?

Sim, basta marcar a opção 'Captura de Tela Completa' para registrar todo o conteúdo da página, além da área visível.

É possível remover anúncios ou banners das capturas?

Sim, você pode inserir seletores CSS no campo 'Ocultar Elementos' para remover automaticamente elementos específicos antes da captura.

A ferramenta suporta visualização móvel?

Sim, ao ativar a opção 'Visualização Móvel', o site será renderizado simulando um dispositivo móvel.

O que é o 'Tempo de Espera'?

É o tempo em milissegundos que o navegador aguarda após carregar a página antes de tirar a foto, ideal para sites com carregamento dinâmico.

Documentação da API

Ponto final da solicitação

POST /pt/api/tools/website-screenshot

Parâmetros da solicitação

Nome do parâmetro Tipo Requerido Descrição
url text Sim -
width number Não -
height number Não -
format select Não -
quality number Não -
fullPage checkbox Não -
waitTime number Não -
hideElements textarea Não -
darkMode checkbox Não -
mobile checkbox Não -

Formato de resposta

{
  "filePath": "/public/processing/randomid.ext",
  "fileName": "output.ext",
  "contentType": "application/octet-stream",
  "size": 1024,
  "metadata": {
    "key": "value"
  },
  "error": "Error message (optional)",
  "message": "Notification message (optional)"
}
Arquivo: Arquivo

Documentação de MCP

Adicione este ferramenta à sua configuração de servidor MCP:

{
  "mcpServers": {
    "elysiatools-website-screenshot": {
      "name": "website-screenshot",
      "description": "Gera capturas de tela de alta qualidade de sites web com opções personalizáveis usando navegador sem cabeça",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=website-screenshot",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Você pode encadear várias ferramentas, ex: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, máx 20 ferramentas.

Se você encontrar algum problema, por favor, entre em contato conosco em [email protected]