Pixel Editor is a free browser-based pixel art creation tool built for the web. Draw pixel-by-pixel on canvases ranging from 8×8 icons to 128×128 sprites with ten drawing tools, a curated terminal-inspired color palette, multi-frame animation, and lossless PNG, GIF, and spritesheet export. Everything runs 100% client-side — no uploads, no accounts, no data leaves your device. It is purpose-built for game sprites, app icons, social media avatars, emoji-style art, retro game tiles, and pixel art animations.
Pixel Editor includes ten drawing and editing tools: Pencil — freehand pixel drawing with an adjustable 1–4px brush. Eraser — remove pixels precisely, also brush-size aware. Fill (Bucket) — flood-fill any enclosed region instantly. Eyedropper — sample any color already on the canvas. Line, Rectangle, Filled Rectangle, and Circle (Bresenham pixel-perfect circles) for shapes. Select — marquee-select a rectangular region. Move — drag a selection to a new position on the canvas.
Choose from four standard canvas presets: 8×8 (icons and tiny sprites), 16×16 (classic NES/Game Boy game sprites and favicons), 32×32 (detailed sprites and emoji-style art), and 64×64 (game tiles and character sheets). You can also set a completely custom width and height up to 128×128 for non-standard dimensions — perfect for pixel banners, social media graphics, or wide-format retro pixel scenes. The canvas can be zoomed in up to 32× for precise per-pixel editing of any size.
Use the Brush Size buttons in the Tools panel (1px, 2px, 3px, 4px) to change how thick the Pencil and Eraser paint. The keyboard shortcuts [ and ] decrease and increase brush size on the fly without leaving the canvas. Brush size only affects the Pencil and Eraser — Line, Rectangle, and Circle always draw crisp 1px outlines (or solid fills for Filled Rectangle).
Click any of the Export PNG buttons in the Export panel and choose your scale factor: 1×, 2×, 4×, or 8×. A 32×32 canvas exported at 8× produces a crisp 256×256 PNG. The download happens instantly in your browser using the Canvas API. The exported PNG preserves full transparency (alpha channel), making it perfect for game engines like Unity and Godot, web apps, Figma, Photoshop, and any design tool that requires transparent sprite backgrounds.
Yes. The Frames panel lets you add, duplicate, delete, and switch between unlimited animation frames — perfect for walk cycles, idle animations, and looping game sprite sheets. Enable onion skin to see the previous frame faintly overlaid at 30% opacity while you draw, making it easy to keep motion consistent frame to frame. Use the animation preview window to play back your frames at an adjustable frame rate (1–60 fps).
Yes. Pixel Editor includes a from-scratch GIF89a encoder with LZW compression built directly into the browser using JavaScript — no server, no external library, and no upload of your artwork. Every frame you've drawn is encoded at your chosen frame rate into a single looping .gif file that downloads instantly.
Yes. The spritesheet export option lays out every animation frame into a single PNG image, ready to drop straight into a game engine like Unity, Godot, or Phaser, or into a CSS sprite animation.
The curated terminal color palette is inspired by classic terminal emulators and retro computing aesthetics: deep black backgrounds, phosphor greens, cyan highlights, warning yellows, alert reds, and muted earth tones. The palette produces visually striking, high-contrast pixel art — ideal for game sprites, hacker-aesthetic icons, and retro-style graphics. You can also use the full color picker and hex input to use any custom color outside the preset palette, giving you unlimited creative freedom.
Every time you pick a new primary color — from the palette, the eyedropper, the color picker, or the hex input — it's automatically added to the Recently Used swatch grid below the main palette. It keeps your last 16 colors so you can quickly jump back to a shade you mixed earlier without hunting through the full picker. Left-click a recent swatch to set it as your primary color, right-click to set it as secondary.
The mirror tools let you draw symmetrically across the canvas. Mirror X reflects every pixel you draw horizontally — draw on the left side and it automatically appears mirrored on the right. Mirror Y reflects vertically — draw on the top half and it mirrors to the bottom. Enable both simultaneously for 4-way radial symmetry, perfect for creating symmetric icons, badges, geometric pixel art, and mandala-style designs. Toggle the mirror buttons in the canvas toolbar above the drawing area.
Choose Select and drag a rectangle on the canvas to mark a region. Switch to Move and drag inside the selection to reposition those pixels anywhere on the canvas — the source area is cleared and the pixels are pasted at the new location once you release. This is useful for repositioning parts of a sprite, nudging a design, or rearranging elements without redrawing them from scratch.
Yes. The Actions panel has Flip Horizontal and Flip Vertical buttons that mirror every frame of your animation instantly, and a Rotate 90° button that rotates the entire canvas — including every frame — clockwise by a quarter turn (canvas width and height swap automatically for non-square canvases).
Yes. Click Import image in the Canvas panel and choose a PNG, JPG, or other browser-supported image file. It's downscaled with nearest-neighbor sampling (no blurring) to fit your current canvas dimensions and dropped onto the active frame, so you can trace over a reference, pixelate a photo, or continue editing an existing pixel-art file. The import happens entirely in your browser — the image is never uploaded anywhere.
Yes. Pixel Editor maintains a 50-step undo/redo history for every drawing action. Press Ctrl+Z to undo and Ctrl+Y (or Ctrl+Shift+Z) to redo. The history counter in the status bar shows how many undo steps are available. Undo and redo work across all tool types — pencil strokes, flood fills, lines, rectangles, circles, flips, rotations, and clear-canvas actions — so you can experiment freely without fear of losing your work.
No. Pixel Editor automatically saves your canvas, all animation frames, and your recent color history to your browser's local storage every time you make a change. Reopen the page later — even after closing the tab or restarting your browser — and your last project reloads automatically. Nothing is ever sent to a server; the autosave lives only in your own browser on your own device. Use New canvas or Clear canvas when you're ready to start fresh.
Yes. Pixel Editor uses the browser's Pointer Events API, so drawing, panning, and shape tools all respond properly to finger and stylus input on iPads, Android tablets, and touchscreen laptops — not just mouse emulation. For the most precise pixel placement, use a stylus and zoom in first. Note: Pixel Editor is a regular web page, not an installable app — there's no PWA or app-store install step, it just works instantly in your mobile browser.
B — Pencil | E — Eraser | G — Fill | I — Eyedropper | L — Line | R — Rectangle (Shift+R for filled) | C — Circle | S — Select | M — Move | X — Swap primary/secondary colors | [ / ] — Decrease/increase brush size | Ctrl+Z — Undo | Ctrl+Y — Redo | +/= — Zoom in | - — Zoom out | Space+drag — Pan canvas | ← / → — Previous/next animation frame | Delete — Clear canvas. Press K or ? to show this full shortcut overlay at any time.
The interface is available in 10 languages: English, Dutch, Spanish, Arabic (with right-to-left layout), Indonesian, French, Portuguese, Russian, Japanese, and German. Switch languages from the language selector — your choice is remembered for your next visit.
Yes, completely free and private. No account required, no uploads to any server, no tracking of your artwork. Pixel Editor runs 100% in your browser using the HTML5 Canvas API and Web APIs. Your pixel art — including autosave data — is processed and stored only on your device — never transmitted anywhere. One of 165 free browser tools at jasperbernaers.com — built for developers, game designers, and anyone who loves retro pixel aesthetics.