What this tool does
This browser-based pixel art editor lets you create retro-style artwork on a grid canvas. Choose from three canvas sizes (8x8, 16x16, or 32x32), pick colors from a 16-color palette or use a custom color picker, and draw with pencil, eraser, or flood fill tools. When you are finished, export your creation as a transparent PNG file.
Everything runs locally in your browser with no server uploads or accounts required.
How it works
The editor represents your artwork as a 2D grid where each cell holds a single color value. The HTML5 Canvas element renders the grid in real time as you draw.
**Drawing tools:** - **Pencil** sets a cell to the active color - **Eraser** resets a cell to transparent - **Fill** uses a breadth-first flood fill algorithm to replace all connected cells of the same color
**Export** creates a clean PNG at 32 pixels per cell (so a 16x16 grid becomes a 512x512 image) with true transparency for empty cells.
Who should use this
- **Game developers** creating sprites, icons, or tilesets for retro-style games - **Designers** prototyping low-resolution icons or favicons - **Hobbyists** exploring pixel art as a creative medium - **Educators and students** learning about digital image representation and color theory
How to use
1. Choose a grid size (8x8, 16x16, or 32x32) from the dropdown 2. Select a drawing tool: Pencil, Eraser, or Fill 3. Pick a color from the palette or use the custom color picker 4. Click or drag on the canvas to draw 5. Use Undo to step back or Clear to start over 6. Click Export PNG to download your artwork
Tips for better pixel art
- **Start small.** An 8x8 or 16x16 grid forces you to focus on every single pixel, which is the heart of good pixel art. - **Limit your palette.** Using fewer colors often produces more cohesive artwork. The built-in 16-color palette is a solid starting point. - **Use the fill tool for backgrounds.** Lay down a background color first, then draw details on top. - **Zoom in mentally.** Each cell is one pixel. Think about silhouette and readability at small sizes. - **Save often.** Export PNGs as you work so you have snapshots of your progress.
FAQs
**Q: What resolution is the exported PNG?** A: Each pixel in your grid becomes a 32x32 block in the PNG. An 8x8 grid exports at 256x256, a 16x16 at 512x512, and a 32x32 at 1024x1024.
**Q: Are empty cells transparent in the export?** A: Yes. Any cell you have not drawn on is fully transparent in the exported PNG.
**Q: Can I import an existing image?** A: This editor is designed for creating new pixel art from scratch. For pixel-level editing of existing images, use a dedicated image editor.
**Q: Is my artwork saved automatically?** A: No. The editor runs entirely in your browser session. Use the Export PNG button to save your work before closing the page.
**Q: Can I use this on a phone or tablet?** A: Yes. Touch drawing is supported, though a larger screen provides a more comfortable editing experience.
Explore Similar Tools
Explore more tools like this one:
- Dot to Pixel Converter — Convert physical size units like Points (pt) or DP to... - E-Signature Tool — Draw your signature on a digital canvas and download it... - Markdown Editor — A focused writing environment with standard markdown... - Plain Text Editor — Simple, lightweight editor for quick drafting and... - Bulk Image Compressor — Compress multiple images at once with adjustable quality...