To upscale pixel art without blur, resize it with nearest-neighbor interpolation (called “None” in GIMP) by a whole-number factor such as 2x, 4x or 10x, and save the result as PNG. Nearest-neighbor copies each pixel into a bigger square without inventing in-between colors, so edges stay hard. The whole-number factor keeps every pixel the same size. Get either one wrong and your art comes out soft or wobbly.
Why does pixel art get blurry when you resize it? #
Most image editors default to bilinear or bicubic resampling. Those methods work out each new pixel by blending the colors around it, which is great for photos because it smooths out jagged edges. Pixel art is the opposite case. As Wikipedia’s article on pixel-art scaling puts it, general-purpose methods like bilinear and bicubic are designed to preserve the appearance of ordinary images, and they don’t suit art that depends on the careful coloring of individual pixels.
When bicubic enlarges a black pixel next to a white one, it fills the gap with grays. Do that across a whole sprite and every crisp edge becomes a soft gradient, and your 16 carefully chosen colors become hundreds.
What is nearest-neighbor scaling? #
Nearest-neighbor is the simplest resampling method there is. Every pixel in the enlarged image takes the color of the closest pixel in the original. At 4x, each original pixel becomes a 4 x 4 block of the same color. Lospec’s scaler describes it as keeping “all pixels sharp and clean” and says it “never introduces any new colors.”
That’s exactly what pixel art needs: bigger, not different.
Why the scale factor must be a whole number #
Nearest-neighbor only stays clean at whole-number factors. At 3.5x, the math can’t make every pixel 3.5 screen pixels wide, so some become 3 wide and some 4. The grid turns uneven, lines wobble, and circles get lumpy.
| Original size | 2x | 4x | 8x | 12x |
|---|---|---|---|---|
| 32 x 32 | 64 x 64 | 128 x 128 | 256 x 256 | 384 x 384 |
| 64 x 64 | 128 x 128 | 256 x 256 | 512 x 512 | 768 x 768 |
| 90 x 90 | 180 x 180 | 360 x 360 | 720 x 720 | 1080 x 1080 |
| 160 x 144 | 320 x 288 | 640 x 576 | 1280 x 1152 | 1920 x 1728 |
If you need a specific final size, such as 1080 pixels for a social post, work backwards. Choose a grid that divides evenly into the target (1080 รท 12 = 90 cells), or scale to the nearest whole multiple and add a plain border to fill the gap.
How to upscale pixel art in GIMP #
- Open your image and go to Image > Scale Image.
- Keep the chain icon next to width and height linked so the proportions stay the same.
- Change the units to percent and enter a whole multiple such as 400, or type the exact pixel size (4 x the original).
- Set Interpolation to None. GIMP’s manual says None copies each pixel’s color from its closest neighbor in the original.
- Click Scale, then File > Export As and choose PNG.
How to upscale pixel art in Photoshop #
- Go to Image > Image Size.
- Make sure Resample is checked, and choose Nearest Neighbor from the resampling menu.
- Set width and height in percent to a whole multiple, such as 400%.
- Save as PNG.
If you often enlarge pixel art in Photoshop, you can also change the default interpolation in Photoshop’s preferences so transforms don’t blur your work.
How to upscale pixel art in your browser #
Lospec’s free Pixel Art Scaler runs entirely in your browser, and Lospec says your image is never uploaded anywhere. It defaults to nearest-neighbor and also offers smoothing algorithms like Scale2x, hqx, xBR and cleanEdge, plus an option to keep the output to the original colors.
How to upscale pixel art on your phone #
If you’re making pixel art from photos on your phone, you may not need a separate upscaling step. Pixelize renders every export by turning each cell of the pixel grid into an exact square block, using a whole-number block size, so the output is never blurred. You pick S, M or XL (targets of about 1080, 1620 and 2160 pixels on the long edge) and the app works out the largest clean multiple. For example, a 90-cell-wide image exports at 2160 pixels wide with each cell 24 pixels across. Files are PNG, and the preview is drawn by the same code as the export, so what you see is what you save. If you’re still choosing a grid, the best pixel size for pixel art portraits has the full numbers.
How to keep pixel art sharp on websites and in games #
- On the web: add the CSS rule
image-rendering: pixelatedto the image. According to MDN’s documentation, the browser then enlarges it with nearest-neighbor to the nearest whole-number multiple and smooths only the small remaining step, so a small file displays large without going soft. For perfectly even pixels, display the image at an exact multiple of its size. MDN notes the property has worked across major browsers since January 2020. - In game engines: set the texture’s filter mode to point or nearest (the name varies by engine) and turn off mipmaps for sprites.
- In video editors: look for a “nearest” or “none” scaling option in the clip’s transform settings. Many default to smooth scaling.
What about smart pixel-art upscalers like hqx and xBR? #
Nearest-neighbor enlarges pixels as they are. A family of “smart” algorithms tries to guess what the art would look like at higher resolution, rounding off diagonals and curves. Wikipedia traces them back to Eric Johnston’s EPX, written at LucasArts around 1992 while porting SCUMM engine games, and lists later ones like Derek Liauw Kie Fa’s 2xSaI, Maxim Stepin’s hq2x/hq3x/hq4x, and Hyllian’s xBR family.
- Scale2x/EPX only reuses colors already in the image, so it keeps the palette intact while smoothing diagonals.
- hqx and xBR blend in new colors for smoother curves. They look closer to a painted illustration, and further from pixel art.
These are popular in emulators. For sharing pixel art as pixel art, nearest-neighbor is almost always what you want.
Why social media still blurs your pixel art #
Social apps resize and recompress everything you upload. A tiny 64 x 64 image gets enlarged by the app with smooth scaling and turns to mush. Two things help:
- Upload large. Enlarge your art yourself with nearest-neighbor to around 1080 to 2160 pixels before uploading. When the app shrinks it, the blocks are big enough to survive.
- Upload PNG where possible. Some apps convert everything to JPEG anyway, but starting from a clean PNG keeps the damage down.
For transparent images like stickers, check how the destination handles transparency. Our pixel art stickers guide covers Telegram’s size rules. For making the art in the first place, see how to turn a photo into pixel art.
Frequently asked questions #
What is the best way to upscale pixel art? #
Nearest-neighbor interpolation at a whole-number scale factor, saved as PNG. It’s available in GIMP (Interpolation: None), Photoshop (Nearest Neighbor), and free browser tools like Lospec’s Pixel Art Scaler.
Why is my pixel art blurry after resizing? #
The image was resized with bilinear or bicubic interpolation, which blends neighboring pixels, or it was saved as a JPEG, which smears hard edges. Redo the resize with nearest-neighbor from the original file and save as PNG.
What scale factor should I use? #
Any whole number. 2x is the most common factor for smart upscalers, while nearest-neighbor enlargements for sharing are often 4x to 12x, chosen to land near 1080 or 2160 pixels.
Can AI upscalers improve pixel art? #
AI upscalers built for photos tend to smooth pixel art into a soft, painted look and invent detail that wasn’t there. That can be interesting as an effect, but if you want the pixel look preserved, use nearest-neighbor.
How do I stop pixel art from blurring in a web browser? #
Add image-rendering: pixelated to the image’s CSS and display it at a whole-number multiple of its original size. Or export the image at its final display size with nearest-neighbor scaling, so the browser doesn’t need to enlarge it at all.