Uma captura de tela crua fica sem graça colada em um tweet, um slide ou uma landing page. Esta ferramenta a coloca sobre um gradiente bonito (ou uma cor sólida), adiciona um espaçamento que dá respiro, arredonda os cantos e coloca uma sombra suave embaixo — o visual caprichado que você vê nas capturas de tela de produtos em todo lugar. Escolha uma proporção para redes sociais ou deixe automático.
Tudo é composto ao vivo em um canvas no seu navegador e exportado como PNG. Sua captura de tela — que pode mostrar dados privados — nunca é enviada.
Como usar
- Adicione uma captura de telaSolte a imagem que você quer deixar bonita.
- Estilize a molduraEscolha um fundo, espaçamento, raio dos cantos e sombra; escolha uma proporção se precisar.
- Baixe o PNGSalve a imagem caprichada, pronta para redes sociais, documentos ou slides.
Transforme uma captura de tela crua em uma captura de produto
O embelezador de capturas de tela coloca sua captura sobre um fundo e adiciona as três coisas que fazem uma captura parecer projetada em vez de tirada às pressas: espaçamento em torno da imagem, cantos arredondados na própria captura, e uma sombra suave que a levanta da superfície. Escolha um gradiente predefinido, uma cor sólida ou um fundo transparente, ajuste cada controle, e veja a prévia se atualizar ao vivo antes de exportar um PNG.
Tudo se compõe em um canvas no seu navegador, então a captura nunca é enviada. Isso importa porque uma captura de tela pode conter uma mensagem privada, uma fatura, um painel ou um token na barra de URL — adicionar uma sombra não deveria significar enviar nada disso a um servidor. Não há conta, e depois que a página carrega ela segue funcionando offline.
A forma certa para onde quer que ela vá
Todo lugar onde você posta uma imagem prefere uma forma. Trave a saída em 16:9 para apresentações de slides e cartões sociais largos, 1:1 para um post quadrado do Instagram ou LinkedIn, 3:4 para uma imagem alta que preenche mais de uma tela de celular, ou deixe em Automático para que o quadro envolva a captura mais seu espaçamento. Quando você trava uma proporção, o espaçamento preenche o resto do quadro para que a exportação encaixe no espaço sem um recorte estranho.
Defina o fundo como transparente e o PNG exporta com a área de espaçamento limpa — o espaçamento, o raio dos cantos e a sombra permanecem, só o preenchimento atrás da sombra desaparece. Essa é a versão que você coloca sobre o seu próprio fundo no Figma, Keynote ou numa miniatura.
Para que as pessoas usam
Fotos de lançamento e changelog — Faça uma captura de produto flutuar sobre um gradiente suave para que um post de lançamento ou changelog pareça intencional em vez de cru.
Tuítes e tópicos polidos — Adicione espaçamento, cantos arredondados e uma sombra tênue para que sua captura pare de colidir com o texto ao redor.
Apresentações de slides — Exporte em 16:9 com um fundo limpo para que as capturas fiquem consistentes por toda uma apresentação.
Posts sociais quadrados — Trave 1:1 para que uma captura larga caiba numa grade do Instagram ou LinkedIn sem ser recortada.
Recursos para Figma e Keynote — Exporte sobre um fundo transparente para manter os cantos arredondados e a sombra, depois coloque-a no seu próprio layout.
Cabeçalhos de documentação — Coloque uma captura sobre uma cor sólida de marca para uma imagem de destaque organizada e na identidade em documentos ou num wiki.
Uma captura de tela crua parece chapada onde quer que você a cole
Uma captura direto da sua tela é um retângulo de pixels com uma borda dura nos quatro lados. Por si só, isso serve para um relatório de bug. Mas no momento em que você a coloca num tweet, num slide, no herói de uma landing page ou num documento do Notion, ela parece inacabada — encosta bem no texto ao redor, os cantos parecem afiados e baratos, e não há separação entre a imagem e o fundo. Você já viu a versão polida cem vezes: uma captura de produto flutuando sobre um degradê de cor suave, com um pouco de espaço para respirar em volta, cantos levemente arredondados e uma sombra sutil para ela se destacar da página. Esse visual não é um filtro nem um modelo pronto. São três coisinhas empilhadas juntas, e esta ferramenta faz exatamente essas três coisas.
Você solta uma captura no canvas e ela compõe a imagem finalizada ao vivo no seu navegador. Você escolhe um fundo — um degradê predefinido, uma cor sólida ou transparente — define quanto espaçamento fica em volta da captura, escolhe o raio dos cantos e ajusta a sombra para cima ou para baixo. A prévia atualiza à medida que você mexe. Quando estiver do jeito certo, você exporta um PNG. A captura, que pode conter uma thread de e-mail, um painel, um chat, números de conta, qualquer coisa, é desenhada direto num elemento <canvas> e nunca sai da aba. Sem upload, sem conta, e uma vez que a página tenha carregado, continua funcionando com a rede desligada.
O que espaçamento, arredondamento, sombra e degradê de fato fazem
- Espaçamento dá à captura uma margem para ela não ficar espremida de borda a borda. Esse vão é o que faz a imagem se ler como um objeto deliberado colocado sobre uma superfície, em vez de uma captura crua.
- Cantos arredondados na própria captura suavizam os quatro ângulos retos duros. É uma mudança minúscula que instantaneamente se lê como "projetado" em vez de "capturado".
- Uma sombra suave separa a captura do fundo, para que pareça estar um pouco acima da superfície em vez de colada chapada nela. Mantenha-a sutil — é isso que vende a profundidade sem parecer pesada.
- Um fundo em degradê (ou sólido) preenche o espaçamento com cor. Um degradê suave de dois tons é a maior razão pela qual aquelas capturas de lançamento de app e de changelog parecem caras; uma cor sólida é a alternativa mais calma e alinhada à marca.
Juntas, essas coisas são o visual de "captura de produto", e esse é todo o escopo da ferramenta — nem mais, nem menos.
Proporções para onde ela vai
A saída pode ser Auto (o quadro apenas envolve sua captura mais o espaçamento) ou travada em 16:9, 4:3, 1:1 ou 3:4. A proporção importa porque cada lugar em que você posta tem um formato preferido: 16:9 para apresentações de slides e cartões sociais largos, 1:1 para um post quadrado do Instagram ou LinkedIn, 3:4 para uma imagem alta que preenche mais de uma tela de celular. Trave a proporção e o espaçamento preenche o resto do quadro em volta da sua captura, para que a exportação caia naquele espaço sem ser cortada de forma estranha.
Fundo transparente, de propósito
Defina o fundo como transparente e o PNG exporta com a área de espaçamento livre em vez de colorida. É o que você quer quando vai colocar a captura de cantos arredondados e com sombra sobre o seu próprio fundo no Figma, no Keynote ou numa miniatura — você mantém o espaçamento, o raio e a sombra, e a solta sobre a superfície que você já tem. A sombra permanece; só o preenchimento atrás dela desaparece.
Por que ser só local é o ponto aqui
Capturas de tela são, silenciosamente, uma das coisas mais privadas de que você vai querer compartilhar uma versão. Uma única captura pode mostrar o nome de um cliente, uma fatura, uma DM privada, uma métrica interna, um token numa barra de URL. Um embelezador que envia sua imagem a um servidor para "processá-la" está pedindo que você entregue tudo isso só para adicionar uma sombra. Aqui a composição é puro trabalho de canvas no seu próprio navegador, então não há nada para enviar e nada em que confiar.
Uma nota honesta sobre o escopo: isto adiciona o polimento de degradê, espaçamento e sombra e nada mais. Não envolve sua captura numa moldura de navegador ou de celular, e não adiciona setas, desfoque ou anotações — é o visual de embelezamento, uma captura por vez.
Por que o IMG.DIY
Gradiente ou sólido
Gradientes prontos ou qualquer cor sólida.
Espaçamento e arredondamento
Espaço para respirar e cantos arredondados.
Sombra suave
Profundidade ajustável para um visual flutuante.
Privado
Composto localmente — nunca enviado.