8 fps

Tela

Exportar

Escala

Importar imagem

Solte uma imagem aqui ou toque para escolher
Cores

Uma tela de 64 × 64 tem 4.096 pixels, o bastante para retratos, itens detalhados e pequenas cenas. Use camadas para separar traço e cor, e exporte em 8× para uma imagem de 512 × 512 ou em 16× para 1024 × 1024.

Como usar

  1. Toque no botão de tamanho para escolher uma tela de 8×8 a 128×128 pixels, ou comece a desenhar sobre o exemplo.
  2. Escolha uma ferramenta e uma cor e desenhe. Com Espelho ligado, cada traço é copiado para o outro lado.
  3. Use camadas para separar contornos e cores, e quadros para animar. Reproduzir mostra a animação na prévia.
  4. Abra Exportar para baixar um PNG de 1× a 32×, uma sprite sheet ou um GIF animado.
  • O desenho é salvo automaticamente neste navegador e nunca sai do seu aparelho. Salve um arquivo de projeto (.json) para guardar uma cópia ou continuar em outro dispositivo.
  • O clique direito desenha com a cor secundária e Alt+clique pega uma cor. Shift+clique com o lápis traça uma reta a partir do último ponto; com o balde, recolore todos os pixels daquela cor na camada.
  • Cada quadro tem sua própria cópia de todas as camadas. O papel cebola mostra o quadro anterior, e mais fraco o próximo, para alinhar o movimento.
  • As exportações mantêm as bordas dos pixels nítidas em qualquer escala. O GIF mantém a transparência, a menos que você ative o fundo branco.
  • Importar tira a média de cada bloco da imagem e reduz a 4–64 cores ou à paleta atual. Escolha Camada atual para desenhar por cima.
  • Em telas de toque, desenhe com um dedo; faça pinça com dois para dar zoom e arraste com dois para se mover.

Escolher o tamanho da tela

16 × 16 é o tamanho clássico para ícones, itens e personagens pequenos; 32 × 32 dá espaço para rostos e detalhes e é comum em personagens de jogos; 64 × 64 serve para retratos e cenas maiores. Telas pequenas obrigam a simplificar, o que ajuda muito a aprender.

Pixel art é desenhado pequeno e mostrado grande. Exporte em 8× ou 16× para redes sociais: um sprite de 32 × 32 em 16× vira um PNG nítido de 512 × 512, porque cada pixel é copiado como um bloco, sem borrar.

Camadas, quadros e papel cebola

Use uma camada para o contorno e outra para cores ou sombras, assim dá para trocar cores sem redesenhar as linhas. Na animação, cada quadro tem sua própria cópia de todas as camadas. O papel cebola mostra o quadro anterior bem claro, e o próximo mais claro ainda, para alinhar o movimento. Reproduzir mostra o loop de 1 a 30 quadros por segundo; 8 a 12 fps é uma velocidade típica para ciclos de caminhada.

Atalhos e dicas

Clique direito desenha com a cor secundária, Alt+clique pega uma cor e Shift+clique com o lápis traça uma linha reta a partir do último ponto. Shift+clique com o balde recolore todos os pixels daquela cor na camada, útil para trocar paletas. Salve um projeto .json como cópia ou para continuar em outro aparelho.

Perguntas frequentes

Qual o melhor tamanho para pixel art?

Quem está começando costuma usar 16 × 16 ou 32 × 32. O primeiro mantém as formas simples; o segundo dá espaço para expressões e sombras. Para cenas detalhadas, 64 × 64 ou mais.

Como exportar pixel art sem ficar borrado?

Exporte o PNG com uma escala como 8× ou 16×. Cada pixel vira um quadrado sólido, então as bordas continuam definidas em qualquer tamanho.

Posso fazer um GIF animado?

Sim. Adicione quadros, desenhe cada pose, confira o loop em Reproduzir e ajuste a velocidade, depois exporte o GIF. A transparência é mantida, a não ser que você ative o fundo branco.

Como fazer uma folha de sprites para um jogo?

Desenhe os quadros da animação, escolha folha de sprites em Exportar e organize os quadros em linha ou em grade. A folha mantém o tamanho exato em pixels para engines de jogos.

Meu desenho fica salvo?

Fica salvo automaticamente neste navegador. Para ter uma cópia ou mudar de aparelho, baixe o projeto como arquivo .json e abra no outro dispositivo.

Dá para transformar uma foto em pixel art?

Sim. Importar faz a média de cada bloco da imagem e reduz para 4 a 64 cores ou para sua paleta atual; depois você ajusta o resultado à mão.

Usado junto com

Como usar

Passos

  1. Toque no botão de tamanho para escolher uma tela de 8×8 a 128×128 pixels, ou comece a desenhar sobre o exemplo.
  2. Escolha uma ferramenta e uma cor e desenhe. Com Espelho ligado, cada traço é copiado para o outro lado.
  3. Use camadas para separar contornos e cores, e quadros para animar. Reproduzir mostra a animação na prévia.
  4. Abra Exportar para baixar um PNG de 1× a 32×, uma sprite sheet ou um GIF animado.

Atalhos

BLápisEBorrachaGBalde de tintaLLinhaRRetânguloCCírculoIConta-gotasMMover a camadaXTrocar coresShift + XEspelhar esquerda e direitaShift + YEspelhar em cima e embaixoFFormas preenchidas[ ]Tamanho do pincel1–9Cor da paletaCtrl + ZDesfazerCtrl + Shift + ZRefazerNDuplicar quadroShift + NQuadro vazio, .Quadro anterior ou próximoPReproduzir ou pausarOPapel cebolaEspaçoSegure e arraste para mover a visualização0Ajustar à telaDeleteLimpar a camadaCtrl + SSalvar projetoCtrl + EExportar

Bom saber

Funciona no seu navegador. Arquivos e textos nunca saem do seu dispositivo.