How to Draw Pixel Art from Scratch
Choose Your Canvas Size
Pick your dimensions based on the project: 16×16 for icons, 32×32 for sprites, larger for detailed scenes. Smaller forces creative economy; bigger allows more detail.
Block In Your Base Colors
Start with the silhouette — use fill to lay down large color zones. Don't detail yet. Get the overall shape and palette right first.
Refine with the Pen Tool
Switch to pen and add detail pixel by pixel. Use the eraser to clean edges. Toggle the grid on/off to check how the art looks at final size.
Export PNG
Download a crisp PNG. Each pixel is a perfect square with no smoothing — ready to use in games, websites, or anywhere pixel-perfect output is needed.
Features
256-Color Pixel Art Palette
Curated 256 colors optimized for pixel art — bright primaries, muted earth tones, shadows, highlights. Not a generic color picker; every shade is chosen for pixel work.
Pixel-Perfect Drawing Tools
Pen locks to single pixels. Fill bucket floods contiguous same-color areas. Color picker samples any pixel on canvas. Eraser removes to transparent. All tools have single-key shortcuts.
Canvas Sizes from 8×8 to 100×100
Start at 8×8 for icons, 16×16 for classic game sprites, 32×32 for detailed characters, or up to 100×100 for complex scenes. Resize anytime — existing pixels scale to the new boundary.
Grid Display Toggle
Toggle the pixel grid on and off. Grid-on is essential for precise placement; grid-off shows how the final PNG will look at actual size.
50-Step Undo History
Full undo/redo history for confident experimentation. Try a new color scheme, see if it works, undo if it doesn't — no commitment required.
Crisp PNG Export
PNG export renders each pixel as a perfect square — no anti-aliasing, no blur. The file is exactly what you drew, ready for games, web, or printing at any scale.
What Is Pixel Art?
Pixel art is a digital art form where images are created and edited at the pixel level, using a limited color palette. It's the visual language of early video games — NES, Game Boy, SNES — and remains central to indie game development, icon design, and retro aesthetic today.
What makes pixel art distinctive is intentional constraint. Working at 16×16 or 32×32 forces clarity: every pixel counts, every color choice is deliberate. This constraint is also what makes pixel art fast to learn and deeply satisfying to master.
MakeBead's pixel art editor gives you everything you need to start: a purpose-built 256-color palette, tools that snap to pixel boundaries, and a clean PNG export. Draw your first sprite, build an icon set, or create an entire game tileset — all in the browser.
Pixel Art Fundamentals on a Blank Canvas
Pick the canvas for the job, then commit to it
Pixel art sizes are conventions, and the conventions exist because they work. 16×16 is the classic tile and sprite size — an NES character, a Minecraft item icon, a favicon. 32×32 gives a character a face and a pose. 64×64 is a portrait or a detailed enemy, and 100×100 is a scene. Pick the size that matches what the art is for, because a sprite drawn at 64×64 and shrunk to 16×16 turns to mush, and a 16×16 icon scaled up is just a bigger 16×16 icon.
Commit before you draw. Resizing later keeps the pixels but not the composition: a character that filled a 32×32 frame becomes a small figure in the corner of a 64×64 one. If you are drawing a set — a tileset, an icon pack, a party of characters — decide one canvas size for the whole set and keep every piece on it, so they sit together at the same scale in the game or on the page.
Palette discipline: ramps and hue shifting
The 256-colour palette is a menu, not a target. Most finished sprites use eight to sixteen colours, arranged in ramps: three to five steps of one material from shadow to highlight. What separates good pixel art from flat pixel art is that a ramp does not just get lighter — it shifts hue. Shadows lean toward blue or purple, highlights toward yellow or orange, so a red shirt's shadow is a cool crimson and its highlight a warm coral rather than a pinker red.
Build the ramps first, then draw. Pick the mid-tone for each material, choose a shadow and a highlight that shift hue as well as value, and try to reuse one ramp across several materials — the same three greys can be armour, stone and a cloud. When two colours in your sprite are so close that you have to zoom in to tell them apart, one of them is not earning its place.
Clean lines: the 1-2-1 rule and dithering by hand
Diagonal lines in pixel art are staircases, and the eye reads a staircase as a smooth line only when the steps are regular. A 45° line is one pixel per step. A shallower line is runs of two, three or four pixels — and the runs must all be the same length, or the line looks bent. The classic error is a corner where two lines meet and leave a doubled pixel; erase it and the corner sharpens. Draw with the pen at single-pixel width and zoom out often; jaggies show at 1× that hide at 8×.
Dithering — a checkerboard of two colours — is how pixel art fakes a third colour and a gradient with a limited palette. A 50% checker between two ramp steps reads as the step between them; a sparser pattern reads as a softer transition. Use it for skies, shadows on large surfaces and metal, and keep it off small sprites, where at 16×16 a checker just looks like noise.
Readability at 1× and the silhouette test
The art will be seen at its real size, or a whole-number multiple of it, never at the zoom you draw at. Toggle the grid off and look at the canvas as a whole every few minutes; better, squint at it. If the pose, the object or the letter still reads with the detail blurred away, the silhouette is right. If it does not, no amount of shading will save it — fix the outline first.
A one-pixel outline in a darker version of the fill (not black) keeps a sprite legible against any background. A pure black outline works on light backgrounds and disappears on dark ones; a selective outline — dark where the form turns away from the light, lighter where it faces it — is the technique most modern pixel art uses, and the pen tool with a ramp already built makes it a matter of clicking the right shade.
Export without blur
The PNG export writes one image pixel per canvas cell with no smoothing, which is exactly what a game engine wants. What can still blur it is the step after: scaling. Only ever scale pixel art by whole numbers — 2×, 3×, 4× — with nearest-neighbour interpolation. In Unity that is Filter Mode set to Point and Compression set to None on the texture; in Godot, the texture filter set to Nearest; in a browser, image-rendering: pixelated. A 150% scale, or any bilinear resample, softens every edge you drew.
Cells you leave empty export as transparent, so a sprite needs no background colour at all. If the art is going on a web page or into a document rather than a game, export at the canvas size and let the page scale it, or export once at 4× for print — never resize the PNG in a photo editor with its default settings.
More Free Design Tools
Want to convert a photo into a bead pattern, or design a different craft type?
Bead Pattern Creator
Draw Perler bead patterns from scratch
Cross Stitch Pattern Designer
Design cross stitch patterns from scratch using DMC floss colors
Minecraft Pixel Art Designer
Plan Minecraft pixel art and map art builds using official block colors
LEGO Mosaic Designer
Design LEGO mosaics from scratch using official brick colors
Kandi Pattern Designer
Design kandi singles, cuffs, and pony bead art from scratch
Diamond Painting Pattern Designer
Create diamond painting patterns from scratch using DMC drill colors
Bead Loom Pattern Designer
Design bead loom patterns from scratch with Miyuki Delica (DB) colors
Frequently Asked Questions
Is this a pixel art maker or a pixel art generator?▾
Both fit — MakeBead is a from-scratch pixel art maker and generator. You start with an empty canvas and build the art yourself with the pen, fill, and eraser tools, rather than uploading a photo. If you want to generate pixel art automatically from an existing image, use the Pixel Art Converter instead.
What canvas size should I use for game sprites?▾
16×16 is the classic NES sprite size. 32×32 is common for modern indie games and gives room for detail. 64×64 works for character portraits. Most platformer tiles are 16×16 or 32×32.
How do I make a transparent background?▾
Leave cells empty (un-drawn). The PNG export renders empty cells as transparent, giving you a clean sprite ready for any background color in your game or app.
Can I use this for game development assets?▾
Yes. Export as PNG and import directly into game engines (Unity, Godot, Pygame). The crisp pixel export with no anti-aliasing is exactly what sprite rendering requires.
How do I fill a large area quickly?▾
Select the fill tool (F key) and click any cell to flood-fill all contiguous cells of the same color. Works for backgrounds, solid shapes, and replacing a color across a region.
Can I zoom in while drawing?▾
The canvas view is designed for close-up work by default. Use the grid toggle to see pixel edges clearly at any zoom level in your browser.