Como fazer um GIF animado com imagens e manter o arquivo leve

Fazer um GIF com um punhado de imagens estáticas leva um minuto. Fazer um que não tenha vários megabytes exige saber como o formato cobra, e ele cobra de um jeito fácil de calcular antes de você apertar qualquer coisa. Este guia trata de imagens estáticas; se você parte de um trecho de vídeo, as medições em vídeo para GIF: os bytes por pixel por quadro cobrem esse caso.

Como um GIF cobra

GIF animado é uma pilha de imagens estáticas completas, cada uma guardada como índices de paleta de 8 bits e comprimida com LZW, com um intervalo gravado ao lado de cada uma. Não há estimativa de movimento nem quadro de referência: nada no formato percebe que dois quadros são quase a mesma imagem. Por isso o tamanho é praticamente uma multiplicação:

bytes ≈ largura × altura × quadros codificados × bytes por pixel por quadro

O último termo é definido pela imagem, não por uma configuração. Medido com o codificador que esta ferramenta usa, no Chromium, em 27 de setembro de 2026:

Conteúdo	Bytes por pixel por quadro
Fotografia, 800 × 533, 8 quadros	0.56 a 0.69
Fotografia, 480 × 320, 8 quadros	0.59 a 0.75
Faixas de cor chapada	0.033
Captura de tela de interface	0.006 a 0.013

São duas ordens de grandeza entre uma fotografia e uma captura de tela. O LZW comprime muito bem longas sequências de pixels idênticos e ganha muito pouco com o grão fotográfico, então nenhuma configuração de paleta ou de pontilhamento fecha essa diferença.

Calculando o peso antes de montar

A ferramenta mostra a estimativa em “What this will weigh” (quanto vai pesar), acima do botão de montagem. Ela pega uma amostra de 64 × 64 dos seus pixels, conta as cores distintas e escolhe uma taxa entre 0.03 bytes por pixel por quadro (64 cores ou menos na amostra, o que indica imagem chapada) e 0.65 (2 000 ou mais, o que indica imagem fotográfica). Depois soma 800 bytes pelo arquivo e 24 por quadro. Esta é a conta para seis fotografias em 4:3:

Configuração	Quadros codificados	Tamanho do quadro	Taxa usada	Estimativa
Seis fotos, largura 480	6	480 × 360	0.65	674 864 B
Seis fotos, largura 240	6	240 × 180	0.65	169 424 B
Seis fotos, largura 480, crossfade de 2, em loop	18	480 × 360	0.65	2 022 992 B
Doze fotos, largura 800	12	800 × 600	0.65	3 745 088 B
Seis capturas de tela chapadas, largura 480	6	480 × 360	0.03	32 048 B

A primeira linha é 800 + 6 × (24 + 480 × 360 × 0.65) = 674 864. Três coisas saem da tabela.

A largura é a alavanca. Reduzir a largura de 480 para 240 divide os pixels por quatro e levou a estimativa a 25% da primeira linha (169 424 ÷ 674 864 = 0.251). Nenhum outro controle chega perto pelo custo visual.

O crossfade é cobrado em quadros inteiros. Cada etapa de transição é um quadro extra completo. Com duas etapas entre cada uma das seis imagens, e a última imagem voltando para a primeira porque a animação está em loop, 6 imagens viram 6 + 6 × 2 = 18 quadros codificados, e a estimativa triplica. As transições ficam 40 ms cada uma na tela, então a duração só cresce de 1.2 segundo para 1.68 (6 × 200 ms + 12 × 40 ms).

A linha vermelha é 3 000 000 bytes. Acima dela, a estimativa fica vermelha. Doze fotos com 800 pixels de largura passam dela com folga.

A estimativa aparece como uma faixa de 35% para cada lado do valor provável e é substituída pela contagem real de bytes quando o arquivo é montado. Vale conhecer dois limites dela. Ela não muda quando você mexe em “Colours” ou “Dithering”, porque depende só do tamanho, da quantidade de quadros e da amostra de pixels. E, para capturas de tela de interface chapadas, a taxa mais baixa dela, 0.03, fica acima dos 0.006 a 0.013 medidos de fato, então um GIF de captura de tela pode sair bem abaixo da faixa mostrada.

Fazendo no GIF maker

1. Abra o GIF maker e pressione “Choose images” (escolher imagens), ou solte as imagens na caixa; elas viram os quadros na ordem em que você as adiciona. HEIC vindo direto do iPhone geralmente precisa ser convertido antes.
2. Ponha os quadros em ordem em “Frames · drag to reorder” (quadros: arraste para reordenar). Arraste uma miniatura ou use os botões ← e → embaixo dela; × remove um quadro, e “Add more images” adiciona mais no final.
3. Escolha uma largura: 240, 320, 480 (o valor inicial), 640 ou 800, ou digite uma em “Exact width”. A altura segue o formato do primeiro quadro.
4. Defina o tempo com o controle “Frame delay” (intervalo entre quadros), que começa em 200 ms (5 fps). Para definir o tempo de cada quadro, pressione “One delay for all” para que ele passe a mostrar “Per-frame delays”, e digite na caixa de ms embaixo de cada miniatura.
5. Defina “Loops · 0 is forever” (repetições; 0 é infinito). Quadros com formato diferente do primeiro são posicionados com “Fit inside” ou “Fill and crop”, sobre um fundo “White”, “Black” ou “Grey”.
6. Leia “What this will weigh”. Se estiver vermelho ou simplesmente grande demais, reduza a largura antes de mexer em qualquer outra coisa.
7. Pressione “Build the GIF” e depois “Download” (o botão mostra o tamanho real). Em “The actual file”, a ferramenta mostra os bytes reais por pixel por quadro do arquivo que acabou de gerar.

O intervalo que você digita e o intervalo que você recebe

O formato guarda cada intervalo como uma contagem de centésimos de segundo, então todo valor cai numa grade de 10 ms: 33 ms é gravado como 30, que toca a 33.3 quadros por segundo em vez de 30. Por baixo disso, todos os grandes navegadores substituem um intervalo de 10 ms ou menos por 100 ms, uma regra herdada do Netscape que nada informa. O controle deslizante para em 20 ms. As caixas por quadro aceitam 10, e se você digitar esse valor, a ferramenta avisa em vermelho que os navegadores vão substituí-lo por 100 ms, e a prévia toca na velocidade mais lenta que o arquivo vai ter de verdade.

Cores e pontilhamento

“Colours” oferece 32, 64, 128 (o valor inicial) e 255, o máximo que o formato permite depois de reservar uma posição para a transparência. Uma única paleta é montada a partir de todos os quadros e compartilhada, e é isso que impede que áreas chapadas mudem de cor de um quadro para o outro. “Dithering on” (pontilhamento ativado) esconde as faixas em degradês espalhando o erro e geralmente aumenta o arquivo, porque pixels espalhados dão ao LZW menos sequências para comprimir. Menos cores realmente encolhem um GIF, ao preço de faixas visíveis; as medições de vídeo para GIF põem números nessa troca.

O GIF tem uma posição de paleta totalmente transparente e nenhuma transparência parcial, então um quadro PNG com bordas suaves é achatado sobre a cor de fundo que você escolheu, em vez de ficar com uma franja serrilhada.

Outras formas de fazer

O FFmpeg consegue montar um GIF a partir de imagens numeradas, com uma paleta compartilhada:

ffmpeg -framerate 2 -i frame%03d.png -vf "split[a][b];[a]palettegen[p];[b][p]paletteuse" out.gif

-framerate 2 mostra dois quadros por segundo, ou seja, 500 ms por quadro (1 000 ÷ 2). frame%03d.png lê arquivos numerados com três dígitos, de frame001.png em diante. A cadeia de filtros gera uma paleta a partir dos quadros e depois a aplica, a mesma ideia de paleta compartilhada que a ferramenta usa. O macOS e o Windows não têm um jeito nativo de fazer um GIF animado para indicar aqui.

Antes de fazer um, verifique se o destino aceita vídeo. A mesma animação em MP4 ou WebM costuma ser de dez a cinquenta vezes menor e roda com mais fluidez; o GIF é a resposta certa quando o destino só aceita imagens.

Como confirmar que nada foi enviado

Abra as ferramentas de desenvolvedor do navegador na aba Network antes de montar. Pressionar “Build the GIF” pela primeira vez busca o codificador, 11.6 KB com gzip, deste site; nenhuma requisição leva os seus quadros a lugar algum, porque eles são compostos e codificados na aba.

Monte o seu no GIF maker e leia o peso antes de pressionar o botão. Se os quadros precisarem ser cortados ou endireitados antes, faça isso no editor de imagens, que os codifica uma vez em vez de três.