Skip to content
Photo2Pattern

Free photo to pixel art converter

Turn a photo into pixel art you can count

Drop a photograph in, choose how many cells wide the grid should be and what the cells are made of, and Photo2Pattern hands back the picture on that grid plus the color key: a swatch, a mark, a code and the exact number of cells for every color it used. It is free, there is no signup and the file never leaves this tab. The same grid is the whole site — 52 pages that carry it on into beads, brick, blocks, stitches and drills, each one adding the palette you can actually buy and the counts you buy against.

  • 100% free
  • No signup
  • 52 tools in 11 sections
  • 8 palettes here
  • Works offline once loaded

Press Ctrl+V anywhere on the page to drop in a picture you copied somewhere else — no need to click the field first.

Rows follow from the shape of your picture. 16 to 160; 32 to 64 is where a face still reads as that face, and past about 96 the result stops looking like pixel art and starts looking like a small photograph.

Defined as sRGB, so the swatch on this page is the color rather than a photograph of one.

Every cell takes its own nearest color. Flat areas stay flat and the color count stays low — the right choice for anything worked by hand.

Eleven sections, and what each one turns the grid into

Every page below starts where this one does — a picture averaged onto cells and each cell snapped to the nearest color in a fixed set. What changes is what a cell is. On the Perler bead page a cell is a 5 mm bead with a code on the bag; on the cross stitch page it is a full cross in a numbered shade; on the LEGO mosaic page it is a 1×1 plate that has to still be in production. Those three differences are the reason there are 52 pages and not one.

The rest go further from the grid than that. The ASCII art generator makes a cell a character and lets its ink density do the shading; the Minecraft converter makes it a block, and has to know that a map color is not the color of the block you are standing next to; the diamond painting page makes it a 2.5 mm resin drill and counts the bags; and the pixelate page runs the whole thing backwards, to take detail out of a picture rather than to keep it.

Pixel art6 pages
The grid on its own, before it becomes anything you can hold: what cell size a picture survives, which colors a fixed palette actually spends, and how to enlarge finished pixel art without a single edge going soft.
Cross stitch5 pages
Counted work on evenweave — a photo charted in DMC numbers with a symbol per shade, the finished size at every fabric count, and how much aida to buy once a frame has eaten its margin.
Beads4 pages
Fuse beads, kandi and loom work, where the count per color is the order you place. Fuse and seed beads carry catalog codes and are matched against them; kandi is sold as a mixed bag with no published color list, so that page derives its palette from the picture and says so.
Yarn7 pages
Colorwork that is not on a square grid: a crochet stitch is not the same shape as a knit stitch, tapestry crochet climbs in the round, and both distort a picture charted as if it were.
Bricks & blocks4 pages
Studs and blocks, where availability decides the palette — a retired brick color cannot be bought, and a Minecraft map color is not the color of the block you are standing on.
Paint & color6 pages
Drills, outlines, numbered regions and colored panels: the pages where the deliverable is something a person fills in by hand rather than places one unit at a time.
Pixelate & hide7 pages
The other direction — taking detail out of a picture on purpose, and the pages that say plainly when a light blur is recoverable rather than pretending it is not.
ASCII art3 pages
Glyphs instead of cells, where the character ramp does the shading and terminal fonts are taller than they are wide, so the grid has to be corrected before it looks right.
Grids & printables4 pages
Blank paper and overlays: the grid you print, the grid you lay over a reference photo, and the millimeters coming out as millimeters on the page.
Thread colors2 pages
The reference tables the chart pages match against, browsable on their own — every shade, its number, its name, and how far the published color data disagrees about it.
Embroidery files4 pages
Stitch files rather than charts: opening a .dst, converting between the formats machines read, and where a photograph exceeds what auto-digitizing can do.

All 52 tools

Everything here runs in your own tab against your own file, and everything that produces a chart also produces the color key with exact counts. Each page carries four to six links onward to the tool somebody reaches for next, so a job that starts at a photograph and ends at a shopping list never needs the back button.

How to get a chart you can work from

Drop, size, download. The last of those is where a chart stops being a picture of a grid.

  1. Drop the picture in

    Drag a file onto the panel, choose one, or paste a screenshot straight from the clipboard. The file is decoded in this tab by createImageBitmap with the EXIF orientation flag honored, which is why a phone photo comes out the way up you took it rather than on its side, and the long edge is sampled down to 2,000 pixels first so a 48-megapixel original is no slower to grid than a screenshot.

  2. Set how many cells across, then what the cells are made of

    The slider is the only decision that changes the picture rather than its colors: rows follow from the shape of the file, so 48 cells across a landscape photo gives 48 by 36. Then choose the palette. Sixteen colors make something that reads as pixel art from across a room; 454 DMC shades make something that reads as the photograph and takes a year to stitch. Dithering is off, which keeps flat areas flat — turn it on only if the result is banding rather than blocking.

  3. Take the key away, not the picture

    The color key beside the chart is the part you use: a swatch, a printable mark, the catalog code and the exact number of cells carrying it. Download it as CSV to sort or tick off, download the grid as a PNG, or print — printing drops everything around the chart and splits anything wider than 47 cells into sheets with two cells repeated at each join so a row can be matched across the break.

Technical specifications

Tools on this site52 pages across 11 sections — Yarn and Pixelate & hide are the largest at 7 each, Thread colors the smallest at 2
Palettes on this page8 — PICO-8 (16 colors), 16, 8 and 4 grays, Perler fuse beads (117), DMC stranded cotton (454), LEGO solid colors still in production (50), and Minecraft flat-build map colors (61, against the 183 a staircased build reaches)
Grid16 to 160 cells across; rows follow the source aspect ratio. A grid finer than the picture is wide is refused rather than quietly coarsened
Color matchingOklab, one implementation for the whole site. Cell averages are taken in linear light, so a half-black half-white cell resolves to a true mid-gray instead of the darker 128/255 that averaging sRGB bytes gives
Dithering4 modes, off by default: Floyd–Steinberg (all of the error to four neighbors), Atkinson (six eighths, so blacks stay black), and ordered Bayer on a 4×4 matrix
Reading the filecreateImageBitmap with the EXIF orientation flag applied, then the long edge sampled to 2,000 px before the grid is measured. PNG, JPEG, WebP, GIF and AVIF
What you take awayA PNG at up to 26 px a cell, stepped down to hold the file under 4 megapixels so it still renders on iOS; the color key as CSV; and a print layout that splits at 47 × 69 cells with 2 cells of overlap at each join
Runs on a serverNothing. Static HTML plus JavaScript in your own tab — no API call, no account, no upload and no queue

Frequently asked questions

How many cells across should I use?

Between 32 and 64 for a face, and 64 to 96 for a landscape or a whole figure. The number that matters is how many cells the smallest thing you care about gets: an eye needs about three cells across before it reads as an eye rather than a smudge, so if your subject is a head filling a third of the frame, 48 cells across the picture gives that eye roughly the three it needs. Going higher does not fail, it just stops being pixel art — past about 96 the grid disappears into the photograph and you have made a small JPEG with extra steps.

Why do the colors look different from my photo?

Because every cell has been moved to the nearest color in a fixed list, and with 16 colors available the nearest one is often visibly not the original. The move is measured in Oklab rather than in RGB, which is what stops skin tones collapsing into grays — RGB distance treats a shift in blue as being as visible as the same shift in green, and it is not. The other half of the difference is the averaging: each cell is the mean of the source pixels under it, taken in linear light, so a hard edge between black and white becomes a genuine mid-gray rather than the muddy dark one that averaging the raw bytes produces.

Does this work with no connection?

Yes, once the page has loaded. Everything after that is JavaScript running against your own file in your own tab, so a grid still comes back on a plane or in a craft shop basement. What needs the connection is the first load, so open the page before you go somewhere without one. There is no request to make even when the connection is there.

Is my picture uploaded anywhere?

No — there is no upload step to skip, because the file never leaves the browser. It is handed to createImageBitmap, drawn into a canvas this page created, and read back as an array of numbers; none of that involves a network request, and nothing is written to storage either, so reloading loses it. That is worth knowing here mostly because people chart photographs of their own children.

How do I print the chart so it is actually usable?

Use the print button rather than the browser's, and print in color if you can — but the chart works in black and white too, because every color also gets its own mark and the mark is drawn in the cell rather than only in the key. Roughly one person in twelve cannot tell two adjacent greens apart by eye, and a grayscale printer separates none of them, so the marks are not decoration. The sheets are laid out at 47 by 69 cells, which is A4 at 4 mm a cell with a 10 mm margin, and every heavy rule is ten cells from the last one so you can count without starting from the edge again.

Can I get the chart as a list of colors instead of a picture?

Yes — the CSV button gives you one row per color, with the mark, the catalog code, the shade name, the hex, the cell count and the share. That file is the shopping list: it sorts in a spreadsheet, it prints on one page even when the chart takes nine, and it is what you carry to a shop when you are buying against the chart rather than working from it. The counts in it are exact rather than rounded, so 4,182 beads means 4,182 beads.

Which palette should I pick if I do not know yet what I am making?

PICO-8, the default, because sixteen colors make the pixel-art look everybody has in mind and it costs nothing to change afterwards. The material palettes below it exist so you can see the same photograph resolve onto a set you would have to buy — 117 Perler colors, 50 LEGO colors still in production, 454 DMC shades — before you commit money to it. If one of those is what you actually came for, its own page carries the finished size, the counts per bag or skein and the physical warnings this page does not.

About cell size, palette size, and the two ways a picture stops reading

Turning a photograph into pixel art is two lossy steps, and they fail in opposite directions. The first is resolution: the picture is averaged down onto a grid, and anything smaller than a cell is gone. Three cells is roughly the floor for a feature to survive — an eye, a doorway, a letter — so a portrait at 32 cells across works and the same portrait at 32 cells with the head occupying a fifth of the frame does not. The second step is palette: every cell is then moved to the nearest available color, and with sixteen to choose from that move is large. Most people who dislike their result have blamed the wrong one of the two. If the shapes are right but the colors are strange, the palette is too small; if the colors are fine but you cannot tell what it is, the grid is too coarse. Only one of those is fixed by the slider. Neither is fixed by resizing afterwards, which is a separate operation with its own two pages: enlarging finished pixel art has to multiply by a whole number or the edges soften, and taking it down to a smaller grid throws away detail a second time, on top of what this page already discarded.

The nearest-color search runs in Oklab, and that choice shows up most on faces. RGB distance, which is what a quick implementation reaches for, treats equal steps in each channel as equally visible; they are not, and the practical consequence is that skin gets matched to grays because gray sits close to a tan in raw coordinates while looking nothing like it. Averaging is the other decision that is invisible until it is wrong. Because a stored color byte carries a gamma, the plain arithmetic mean of a black pixel and a white one comes out at 128 — a value that sits well below the halfway tone anybody would draw. Cells here are converted to linear light before they are averaged and converted back afterwards. That keeps edges from darkening as the grid coarsens, and it is also why the same photograph gives the same chart on this page and on the palette-building converter, which shares the arithmetic and changes only who chooses the colors.

The last thing worth knowing is what a palette costs once it is physical. A screen palette is free: sixteen colors or two hundred, the file is the same size either way. A material palette is not. Charting a photograph against all 454 DMC shades routinely spends forty of them on fewer than ten stitches each, which is forty skeins bought and forty thread changes made for detail nobody sees from a meter away — and the shade numbers themselves are exact while their screen colors are not, which is the whole subject of the DMC color chart. So the pages that resolve onto something you buy also let you cap the color count and tell you what the cap cost, and the ones that only ever live on a screen — the 8-bit converter, posterize, and the palette generator — do not need to.

Product and company names shown here are the trademarks of their respective owners. Photo2Pattern is an independent tool and is not affiliated with, sponsored by or endorsed by any of them.

Where your picture is read

Your picture is opened by JavaScript running in the tab you are reading this in. It is never uploaded, never sent to a server and never stored anywhere — there is no upload step to undo, because there is no upload. Close the tab and nothing of it remains.

The canvas this page draws into is created by the page and thrown away with the tab, and nothing is written to local storage either — reload and the picture is gone, which is the trade for never having to trust anybody with it. That matters more here than on a calculator, because the files people bring to a craft site are photographs of their own families.