1. Como Funciona o Canvas HTML5
A API Canvas do HTML5 permite renderizar graficos 2D diretamente no navegador usando JavaScript. Esta ferramenta utiliza o contexto 2D do Canvas para desenhar o fundo (solido ou gradiente), aplicar configuracoes de fonte e renderizar o texto com quebra automatica de linhas.
Todo o processamento acontece localmente no seu dispositivo — nenhuma imagem e enviada a servidores, garantindo privacidade total e funcionalidade mesmo sem conexao de internet.
2. Dimensoes por Plataforma
Cada plataforma tem dimensoes ideais para diferentes tipos de conteudo visual:
- Instagram Post (quadrado): 1080x1080px — formato padrao para feed
- Instagram Stories/Reels: 1080x1920px — formato vertical 9:16
- YouTube Thumbnail: 1280x720px — proporcao 16:9
- Open Graph / Facebook: 1200x630px — para links compartilhados
- LinkedIn Post: 1200x627px — proporcao 1.91:1
- Twitter/X Post: 1600x900px — proporcao 16:9
3. Boas Praticas de Tipografia
O texto em imagens deve ser legivel mesmo em telas pequenas. Algumas diretrizes:
- Use fontes sem serifa (Arial, Verdana) para melhor leitura em telas digitais
- Tamanho minimo recomendado: 60-80px para textos principais em 1080px de largura
- Mantenha margem interna de pelo menos 80px para evitar texto cortado
- Negrito melhora a leitura em fundos com gradiente
- Sombra sutil aumenta o contraste em fundos complexos
"A regra de ouro: se voce nao consegue ler o texto confortavelmente em um smartphone a 30cm de distancia, o tamanho da fonte esta pequeno demais."
4. Escolha de Cores e Contraste
A relacao de contraste entre texto e fundo e essencial para acessibilidade. As diretrizes WCAG recomendam:
- Contraste minimo: razao 4.5:1 para texto normal (nivel AA)
- Contraste ideal: razao 7:1 ou superior para maxima legibilidade
- Texto branco (#ffffff) sobre fundo escuro: contraste excelente
- Texto preto (#000000) sobre fundo claro: contraste maximo
- Evite combinacoes vermelho/verde (problema para daltonicos)
5. Formatos de Imagem: PNG vs JPEG
Esta ferramenta exporta em PNG, que e o formato ideal para imagens com texto porque:
- PNG e lossless — sem perda de qualidade na compressao
- Bordas de texto nítidas, sem artefatos de compressao JPEG
- Suporta transparencia (embora nao usada aqui)
- Ideal para imagens com areas solidas de cor e texto
JPEG seria mais adequado apenas para fotografias, onde a compressao com perda e imperceptivel e gera arquivos menores.
6. Perguntas Frequentes
As imagens sao salvas em algum servidor?
Nao. Todo o processamento e feito localmente no seu navegador via Canvas API. Nenhum dado e enviado a servidores externos.
Posso usar fontes do Google Fonts?
A versao atual suporta apenas fontes do sistema. Para usar fontes externas como Google Fonts no Canvas, seria necessario carregar e registrar a fonte no contexto do Canvas — funcionalidade planejada para versoes futuras.
O download nao funciona no meu navegador, o que fazer?
Em alguns navegadores mobile, o download automatico pode nao funcionar. Use o botao "Copiar" para copiar a imagem para a area de transferencia, ou pressione longamente sobre o canvas no iOS/Android para salvar a imagem.