Pixel Art Editor

Pixel Art Editor

Create pixel art with layers, color palettes, animation frames. Draw 8-bit retro sprites. Free online pixel art maker and sprite editor

Pixel art is the deliberate aesthetic of choosing each pixel one at a time — same craft that produced Super Mario, Stardew Valley, and Celeste. The interesting constraint is the palette: limited to 8, 16, or 32 colors total, every dot has to earn its place. This editor offers pixel-perfect canvas (no anti-aliasing), customizable palette, layers, animation frames, and exports to PNG, GIF (animation), and sprite-sheet format ready for game engines.

What makes pixel art "pixel art"

  • No anti-aliasing — every pixel is a hard color. Curves are stair-stepped; that is the aesthetic.
  • Limited palette — historical NES had 4 colors per sprite from a palette of 54. Modern pixel art often uses 16-32 colors for the whole image; constraint forces artistic choices.
  • Hand-placed pixels — each pixel chosen deliberately. Up-scaling a photo to "look like pixel art" does not work; the eye recognizes the difference.
  • Color clustering — shading achieved by adjacent darker pixels, not gradients. Anti-banding (dithering) intentional, not algorithmic.
  • Resolution choice — typical canvas sizes: 16×16, 32×32, 64×64 for sprites; 128×128 or 256×256 for tiles. Then displayed at integer scale (2x, 4x, 8x) for screen.

Working example: a 16×16 character sprite

Input

A simple character — body, head, eyes

Output

Canvas: 16×16 pixels.
Palette: 6 colors:
  Outline: dark gray #2a2a2a
  Skin:    #f4d4a8 (light) and #d8a878 (shadow)
  Hair:    #4a2a1a (dark brown)
  Shirt:   #4a6abc (blue) with #2a4a8c shadow

Workflow:
  1. Lay out silhouette in outline color first.
  2. Fill base colors inside silhouette.
  3. Add shadows (darker version of each base color) on one side.
  4. Add highlights (lighter than base) on the opposite side.
  5. Two pixels for each eye, one pixel between for nose suggestion.

Export:
  PNG at native 16×16: tiny file (<1 KB).
  PNG at 8x scale: 128×128 for display, still under 5 KB.
  Embedded in a sprite sheet: typically 4 directions × 3 walk frames = 12 sprites = 16×192 image.

The 16×16 sprite is the classic "NES character" size. Modern indie games (Stardew Valley, Celeste) use larger sprites (24×24, 32×32) for more detail while maintaining pixel-art aesthetic. Choose canvas size based on how much detail you can afford to draw across all animation frames.

Animation techniques

  • Frame-by-frame — draw each frame separately. Traditional approach; full control.
  • Onion skin — see previous and next frames as transparent ghosts. Helps with smooth motion.
  • Keyframes + tweening — define start and end; interpolate between. Possible for translation; difficult for character motion (eye-shift, posing).
  • Sprite sheets — store all frames in one image (horizontal or grid). Game engines reference frames by coordinates. Standard format.
  • 4-direction walk — 12 frames total (3 per direction × 4 directions). Classic NES-era animation pattern.
  • Idle animation — 2-4 frames cycled slowly. Brings characters to life even when not moving.

Palette design

  • Restricted palettes (DB16, PICO-8, AAP-64) — published 16/64-color palettes designed for pixel art. Constrains choices; many famous indie games use them.
  • Per-character palette — limit each sprite to 4-8 colors. Old-school constraint; produces cohesive look.
  • Cluster shadows — same hue, darker value. Avoid using a generic "gray" as shadow for every color; each base color gets its own shadow.
  • Limited highlights — use highlights sparingly (1-3 pixels max on a 16×16 sprite). Too many highlights = noisy.
  • Two-tone rule — many pixel artists use 2 colors per material (base + shadow OR base + highlight) for clean, readable shading.

When to reach for this tool

  • You are creating sprites for an indie game or game jam.
  • You are making custom emoji or icons in a retro aesthetic.
  • You are designing a logo or branding with pixel-art style.
  • You are learning pixel art and want a sandbox without paying for Aseprite.

What this tool will not do

  • It will not match Aseprite for serious pixel art production. Aseprite has decades of refinement, professional features (tilemap support, advanced animation, color modes), and is the industry standard.
  • It will not auto-pixelate photos. "Filter → pixelate" in Photoshop produces low-resolution images that look bad; real pixel art requires hand-drawing.
  • It will not handle tilemaps natively. For tile-based level design, dedicated tools (LDtk, Tiled) work better.
  • It will not export to every game engine's native format. PNG sprite sheets work universally; engine-specific formats (Aseprite's .aseprite, Unity's sprite atlas) need conversion.

Frequently asked questions

What canvas size should I start with?

16×16 for tiny icons / NES-style sprites. 32×32 for typical RPG characters with detail. 64×64 for larger characters with substantial detail. 128×128 for portraits / hero illustrations. Pick the smallest that fits your needed detail; smaller = faster to draw and animate.

How many colors should a pixel art piece use?

Famous restricted palettes: PICO-8 (16 colors), NES (54 master, 25-32 per scene). For modern work: 16-32 per piece is common; "lush" pixel art uses 64+ but still well-chosen. Quality is in deliberate color choice, not total count.

How do I get pixel-perfect rendering on the web?

CSS: `image-rendering: pixelated;` for crisp scaling. Without this, browsers default to bilinear interpolation, which blurs pixel art on upscale. Same for canvas: `imageSmoothingEnabled = false`.

Should I draw at 1x or scaled-up?

Draw at native resolution (1 pixel = 1 dot). Display at integer multiple (2x, 4x, 8x for screen viewing). Do not draw at 4x and shrink — you lose precision. Most pixel-art tools support a "preview at scale" view alongside the 1x canvas.

Are AI generators "pixel art"?

Output of "make this look like pixel art" prompts is usually NOT pixel art in the strict sense — it has anti-aliasing, jagged edges, unconstrained palettes, and doesn't hand-place pixels. Some AI tools (e.g., diffusion models trained on pixel art) get closer but still need hand-cleanup.

Can I sell my pixel art?

Yes — assets marketplaces (itch.io, OpenGameArt, Asset Store) regularly sell pixel art. Licensing is yours to choose; many indie game devs buy pre-made sprite packs. Original work belongs to you; copying others' style is generally OK, but copying specific sprites is copyright infringement.

Related tools

Image Editor

Edit images with crop, resize, rotate, filters, text. Draw shapes and annotations. Free online photo editor in browser, no upload required

Image Converter

Convert images between PNG, JPEG, and WebP formats. Batch conversion with quality control. Free online image format converter

SVG Path Editor

Draw and edit SVG paths visually with Bezier curves. Create icons and shapes. Free online SVG path builder with code output

Glitch Art Generator

Apply glitch effects to images. Databending, pixel sorting, RGB shift, scan lines. Free online glitch effect maker for aesthetic art

Last updated · E-Utils editorial team