How to use the Eddy McPixel editor
A complete, step-by-step guide to every tool, panel and shortcut. Whether you're drawing your first sprite or your thousandth, this manual covers exactly how to get the most out of Eddy McPixel.
Editor › Manual
Getting started
Eddy McPixel runs entirely in your browser, so there's nothing to install. Visit the editor and you'll land on a fresh canvas ready to draw. On larger screens the full workspace is visible; on phones and small tablets the interface adapts into a touch-friendly layout.
Creating a new canvas
- Open the New canvas dialog from the top toolbar (or press the New button).
- Enter a width and height in pixels. Common sizes include 16×16, 32×32 and 64×64 for sprites, or larger for scenes and tilemaps.
- Choose a starting palette if you like, then confirm. A blank canvas with one layer is created.
Tour of the interface
The workspace is arranged into clear regions:
- Top bar: branding, file actions (New, Open, Save), undo/redo, clear, shortcuts, about, and the Export button.
- Tabs bar: work on multiple canvases at once using tabs.
- Options bar: context-sensitive controls such as brush size, mirror, fill toggle and selection actions.
- Left toolbar: all the drawing tools, plus the grid toggle.
- Canvas: the centre stage where you draw. This is the main working area.
- Right panel: reference image, colour picker and swatches, and the layers list.
- Status bar: cursor coordinates, zoom level, canvas size and a fit-to-screen button.
Drawing tools
Select a tool from the left toolbar or press its shortcut key. Most tools paint with the foreground colour on the left mouse button and the background colour on the right mouse button.
| Tool | Key | What it does |
|---|---|---|
| Pencil | B | Draw single pixels or thick strokes. Turn on pixel-perfect in the options bar to automatically tidy 1px corners so curves stay a clean single-pixel line. Brush size is adjustable from 1 to 32 pixels. |
| Dither brush | D | Paint a clean ordered-dither pattern of your foreground and background colours: ideal for smooth shading and texture. |
| Eraser | E | Remove pixels (set them to transparent) on the active layer. Respects brush size. |
| Fill (bucket) | G | Flood-fill a connected area of the same colour with your active colour. |
| Gradient | Shift+G | Drag to fill the canvas (or your selection) with a smooth ramp from foreground to background. It only ever uses colours from your active palette; toggle dither for an even smoother, dot-free blend. |
| Eyedropper | I | Pick a colour from anywhere on the canvas into your foreground swatch. |
| Line | L | Draw a crisp, pixel-perfect straight line between two points. The outline honours the current brush size, so thicker brushes draw thicker lines while keeping the clean pixel-art look. |
| Rectangle | R | Draw a rectangular outline. Hold Shift for a filled rectangle. The outline respects the brush size; filled rectangles ignore it. Turn on Radius in the options bar to round the corners for rounded boxes. |
| Ellipse | O | Draw an elliptical outline. Hold Shift for a filled ellipse. The outline respects the brush size; filled ellipses ignore it. |
| Select | M | Drag a marquee selection. Selected regions can be moved, cleared, copied and pasted. |
| Magic wand | W | Select a connected region of similar colour with one click. |
| Move | V | Drag the contents of the active layer (or your selection) to reposition it. |
| Hand | H | Pan around a large or zoomed-in canvas by dragging. |
Brush size
For the pencil, dither brush and eraser, change the brush size with the slider and number field in the options bar, or the shortcuts [ and ]. Larger brushes are handy for blocking in big areas quickly. The brush size also applies to the line, rectangle outline and ellipse outline tools, so you can draw thicker strokes that still keep their crisp, pixel-perfect edges. Filled rectangles and ellipses cover their whole area, so they ignore the brush size.
Rounded rectangle corners
The rectangle tool can round its corners so you can draw rounded boxes. With the rectangle or filled rectangle tool active, the options bar shows a Radius control. Toggle it on to switch from sharp corners to rounded ones, then use the number field or the plus and minus buttons to set the corner radius in pixels. The radius is clamped to half the shorter side of the rectangle, so it always fits. Rounded corners work for both the outline and the filled rectangle, and they keep the same clean, symmetric pixel-art look as the rest of the shape tools.
Colours & palettes
Colours live in the right-hand panel. You'll see two swatches: the foreground (left-mouse paint colour) and the background (right-mouse paint colour). Click a swatch to edit it with the native colour picker, or type a hex code directly. Press X to swap the two instantly.
Palettes
Below the picker is a grid of palette swatches. Switch between curated palettes: Eddy Default, Endesga 32, PICO-8 and Grayscale: and click any swatch to load it into your foreground colour. You can also add your own colours to the active palette so they're always one click away.
Layers
Layers let you separate parts of your artwork: for example a sketch layer, a colour layer, and a details layer. The layers list in the right panel shows every layer with a live thumbnail.
- Add & reorder: create new layers and drag to reorder them.
- Visibility: toggle the eye icon to show or hide a layer.
- Opacity: fade a layer from fully opaque to fully transparent.
- Rename: give layers meaningful names to stay organised.
- Duplicate & merge down: copy a layer or combine it with the one beneath.
- Delete: remove a layer you no longer need.
Selection & copy/paste
Use the Select tool (M) to drag a marquee around part of your art, or the Magic wand (W) to grab a region of similar colour. With a selection active you can:
- Move it with the Move tool or arrow keys (Shift+arrows nudge by 10px).
- Copy it (Ctrl/⌘+C) and paste it (Ctrl/⌘+V): pasting always creates a fresh layer.
- Copy image to clipboard as a PNG (Ctrl/⌘+Shift+C) to paste into other apps.
- Select all (Ctrl/⌘+A) or deselect (Ctrl/⌘+D or Esc).
- Clear the selection or the whole layer (Delete).
Mirror & symmetry drawing
Draw symmetrically to create balanced art in half the time. In the options bar, toggle mirror horizontally, vertically, or both. Every stroke you make is then mirrored across the chosen axes, which is ideal for faces, characters, emblems and patterns.
Setting the mirror line
By default each mirror axis runs down the centre of the canvas. You can move it anywhere instead. With a mirror axis active, the options bar shows a Set line button. Click it, then click anywhere on the canvas to drop the mirror line at that position. You can also type an exact position into the X (horizontal mirror) or Y (vertical mirror) number field, where 0 is the top or left edge and the canvas size is the bottom or right edge. Use the reset button to send the line back to the centre.
Showing the mirror line
The active mirror line is drawn on top of the canvas as a dashed guide so you can see exactly where strokes will reflect. Toggle it with the eye button next to the mirror controls if you prefer a clean canvas while you work.
Reference images
Load any image as a non-editable reference layer you can draw over. Use it to trace proportions, match colours, or keep inspiration visible while you work. You can:
- Move it by dragging and resize it with the scale slider or fit option.
- Toggle its visibility and adjust its opacity.
Grid, zoom & pan
- Grid: toggle an alignment grid with the toolbar button or the ' (apostrophe) key to help place pixels precisely.
- Zoom: zoom in/out with + / -, reset to 100% with 0, or hold Ctrl/⌘ and scroll with the mouse. The zoom range runs from 1× to 64×.
- Fit to screen: use the fit button in the status bar to frame the whole canvas.
- Pan: hold Space and drag, use middle-mouse drag, or switch to the Hand tool (H).
Saving & projects
Eddy McPixel saves your entire project: canvas size, every layer,
your reference image and your palette: as a single portable
.eddy file.
- Save (Ctrl/⌘+S) writes the project file. In Chrome and Edge, opening a
.eddyfile lets Save overwrite that same file in place (with a one-time permission); a green dot in the top bar shows the bound file. On other browsers, Save downloads the file. - Open (Ctrl/⌘+O) reloads any
.eddyfile to continue working. - Autosave: your work is continuously saved to your browser and restored automatically when you return.
Exporting to PNG
When your art is finished, export it as a PNG. Open the Export dialog and choose a scale from 1× to 16×: the pixel art is upscaled cleanly so it stays crisp at any size. A live preview shows exactly what you'll get, and you can either download the PNG or copy it straight to your clipboard.
Tiles, maps & transforms
Eddy McPixel isn't just for single sprites; it has a full tile workflow for game artists. When you create a new document you can choose between three modes:
- Sprite; a free-form canvas with layers (the classic mode).
- Tilesheet; a uniform grid of tiles you edit one at a time.
- Tile map; paint tiles from a tilesheet onto a larger map.
Editing a tilesheet
- Create a tilesheet, pick a tile size (e.g. 16×16) and a starting tile count.
- You land on the overview showing every tile. Click any tile to edit it at full canvas size using all the usual tools.
- Use “◀ Whole sheet” in the options bar to return to the overview. Add, duplicate or delete tiles from the overview.
Seamless tiling
- While a paint or shape tool is active, the Seamless group appears in the options bar.
- Wrap makes strokes and flood-fill wrap around the canvas edges, so what leaves one side reappears on the other.
- 3×3 preview tiles your image nine times around the canvas so you can instantly see whether the edges join cleanly.
Building a tile map
- Create a Tile map, choose the tile size and the map dimensions (columns × rows of tiles).
- Select the Stamp tool (S) and pick a tile from the Tiles panel on the right.
- Left-click paints the selected tile into a cell; right-click erases a cell.
- Need a new tile? Draw freely with the pencil, select the region, then click “Tile from selection”; or Alt-click a cell with the Stamp tool to capture it as a new tile. New tiles are added to the tilesheet automatically.
Transform tool
- Select the Transform tool (T). If a selection is active the transforms apply to it, otherwise to the whole active layer.
- Rotate 90° clockwise / counter-clockwise, rotate 180°, or flip horizontally / vertically. Rotations are always pixel-perfect.
- Rotating a full layer 90° also rotates the canvas and every layer with it.
.eddy format. Older
project files keep opening exactly as before.
Keyboard shortcuts
| Action | Shortcut |
|---|---|
| Pencil / Eraser / Fill / Eyedropper | B / E / G / I |
| Dither brush / Gradient | D / Shift+G |
| Line / Rectangle / Ellipse | L / R / O (hold Shift for filled) |
| Select / Magic wand / Move / Hand | M / W / V / H |
| Transform / Stamp tile | T / S |
| Brush size − / + | [ / ] |
| Swap foreground / background | X |
| Clear selection / layer | Delete |
| Copy / Paste | Ctrl/⌘+C / V |
| Copy image to clipboard | Ctrl/⌘+Shift+C |
| Select all / Deselect | Ctrl/⌘+A / D |
| Nudge layer (×10) | Arrow keys (Shift) |
| Undo / Redo | Ctrl/⌘+Z / Shift+Z |
| Save / Open project | Ctrl/⌘+S / O |
| Toggle grid | ' (apostrophe) |
| Zoom in / out / reset | + / - / 0 |
| Pan canvas | Hold Space + drag |
Tips & tricks
- Work in passes. Block in big shapes and colours on a lower layer, then add detail and outlines on layers above.
- Limit your palette. A small, deliberate palette keeps pixel art cohesive and readable: try the built-in palettes to start.
- Use symmetry. Mirror drawing halves the work for anything that should be balanced.
- Zoom in to place pixels precisely, then zoom out often to check the overall read of the image.
- Save often. Autosave has your back, but exporting a PNG gives you a sharable snapshot at any stage.
- Keep reference handy. Drop in a guide image to match proportions or colour without it ever reaching your export.
Accounts, sharing & collaboration
Cloud features are optional. The editor works fully without an account.
Your account
Click Sign in in the top bar to create an account with email, Google, X (Twitter) or GitHub. A free account lets you use the community Palette Repo (browse, import, like and publish palettes) and view documents others share with you.
Sharing a document Premium
Click Share in the top bar to publish the current canvas as a shared document. Choose Invited only or Anyone with link, and set the link permission to Can view or Can edit. Copy the link to send it. (Sharing is Premium; viewing others' docs is free.)
Collaborating & the edit lock
When you open a shared document you join its presence channel — you'll see avatars of who else is there. Only one person edits at a time: click Edit to take the lock. While someone is editing, the document shows "X is editing" and everyone else is in view-only mode (they can toggle layers but can't draw). Click Stop, or just close the tab, to release the lock automatically.
Version history Premium
On a shared document, every Save (Ctrl/⌘+S) commits a version stamped with your name and the time. Open History to browse the timeline, see who changed what, and Restore any earlier version — restoring is itself recorded, so history is never lost.
View-only protection
Viewers get a read-only canvas: drawing and export are disabled, and right-click / drag / selection are blocked as a best-effort deterrent against casual copying. (As with anything on the web, a determined viewer can still take a screenshot — this raises the bar, it isn't DRM.)
Cloud backup & sync Premium
With Premium, your active palette and most recent session auto-save to your private account and restore when you sign in on a new device. Backups are private to you and never reviewed by a person — see our privacy policy.
Put it into practice
Everything in this manual is waiting for you in the editor. Open it and start creating.
Launch Eddy McPixel →