Gerador de sprite sheet

Combine quadros em uma sprite e exporte definições de frames em CSS/JSON.

Visão geral

Gere uma sprite sheet para web/jogos no navegador e exporte o mapa de frames com coordenadas como JSON/CSS.

Como usar

  1. Solte imagens do mesmo tamanho.
  2. Configurar linhas/colunas, padding e ordem.
  3. Selecionar formato (PNG/WebP) e compressão; salvar com CSS/JSON.
  4. Opcional: prefixo e regra de numeração.

Casos de uso

  • Sprites de ícones para animações CSS.
  • Combinar sequências de jogos 2D (andar/atacar).
  • Alternativa leve a Lottie/APNG para loops.

Dicas e conhecimento

  • Sprites reduzem requisições HTTP.
  • Remova margens transparentes para reduzir tamanho.
  • Controle tempo com CSS steps() ou timers JS.

Ferramentas relacionadas