Free Game Tool

Blurry pixel art has more than one possible cause

When you display pixel art in Unity, it may look smeared, the pixel widths may be uneven, or the image may flicker when it moves. There is rarely just one cause, and they fall into four broad groups:

• Import settings: The Sprite’s import settings do not suit pixel art.
• How the image is scaled: The camera or screen scale is not a whole-number multiple. A magnified preview can also be the cause.
• Movement and rotation: Moving or rotating the Sprite breaks the position or shape of the pixels.
• The source image itself: The image was already degraded before you imported it.

This article starts from the symptom and shows you what to check, and in what order. For how the Pixel Perfect Camera works and what PPU and Reference Resolution mean, see What Is Unity’s Pixel Perfect Camera? PPU and Reference Resolution Explained.

First, identify the symptom

Cause 1: Filter Mode is not set to Point

Filter Mode controls how Unity filters a texture when it is stretched. According to the official documentation:

• Point (no filter): The texture appears blocky up close.
• Bilinear: The texture appears blurry up close.
• Trilinear: Like Bilinear, but the texture also blurs between the different mipmap levels.

Pixel art is meant to be scaled up, so with Bilinear the edges get smeared by the amount you enlarge it.

How to fix it

1. Select the Sprite’s PNG in the Project window. You can select several Sprites and change them all at once.
2. In the Inspector, set Filter Mode to Point (no filter).
3. Click Apply.

Cause 2: Compression is applied

When Compression is applied, colors can shift and noise can appear around edges. Pixel art depends on the exact color of each pixel, so this kind of change is easy to notice.

How to fix it

• In the Sprite’s Inspector, set Compression to None.
• If you have set different values in the platform-specific overrides, check the tab for each platform as well.

Cause 3: Other import settings

Non-Power of 2

Non-Power of 2 controls what happens when the width or height of an image is not a power of two (16, 32, 64, 128, 256, and so on). If you set it to anything other than None, the image is scaled to a power-of-two size at import. The official documentation gives an example in which a 257 x 511 px image is scaled to 256 x 512 px or another size, depending on the option you choose. A scaled image no longer has evenly sized pixels.

To keep the import from changing the size of your pixel art, leave this setting at None in most cases.

Generate Mipmap

A mipmap is a set of smaller versions of a texture prepared in advance for when it is displayed at a reduced size. Where an image is shown smaller, mipmaps can make it look blurry. Pixel art is normally enlarged by whole-number multiples rather than shrunk, so you usually do not need them. If blurriness bothers you, check that Generate Mipmap is turned off.

Cause 4: How the image is scaled

Even when the Sprite settings are correct, the pixel widths become uneven if the scale on screen is not a whole-number multiple.

The scale is not a whole number

For example, if some source pixels are drawn four screen pixels wide and others five, the pixel widths look uneven. This happens when you are not using the Pixel Perfect Camera, or when the Reference Resolution does not fit the monitor resolution. The mechanism is explained in our Pixel Perfect Camera article. You can check the scale for each monitor resolution with our Pixel Perfect Camera Preview tool.

Sprite PPU values do not match

If the camera’s Assets Pixels Per Unit differs from a Sprite’s Pixels Per Unit, the Sprite’s size on screen changes. If the resulting scale is not a whole number, the pixel widths become uneven. When only some images look wrong, check the Pixels Per Unit of those Sprites.

The Game view Scale is not 1x

The editor’s Game view has a Scale slider for zooming in to examine details. Moving it to the right enlarges the display. It can move by accident, for example with the mouse wheel, and the game may look blurry in the editor even though the game itself is fine. First check that Scale is set to 1x.

Low Resolution Aspect Ratios is enabled

The Low Resolution Aspect Ratios option, in the aspect ratio menu of the Game view, emulates the pixel density of older displays and reduces the Game view’s resolution when an aspect ratio is selected. When it is enabled, the display can look coarser than it really is. If the view looks wrong, turn it off and check again. Note that on non-Retina displays on Windows, it is always enabled.

If you still cannot trust what you see in the editor, building the game and checking the result is the most reliable way.

The Pixel Perfect Camera’s Filter Mode (newer versions)

In the documentation for newer versions, you can choose how the final image is upscaled (Filter Mode) only when Stretch Fill is selected in the Pixel Perfect Camera. The options are Retro AA and Point. The official documentation explains that with Point, pixel placement can suffer and pixel perfectness can be lost. If this property exists in your version, review its setting.

Cause 5: When moving or rotating

It flickers or jitters when it moves

If a Sprite moves smoothly through positions between pixels (sub-pixel positions), the pixel widths appear to change from frame to frame. Setting Grid Snapping to Pixel Snapping on the Pixel Perfect Camera makes Sprite Renderers snap to a grid at render time, so Sprites appear to move in pixel-by-pixel increments. The grid size is based on the Assets Pixels Per Unit value. This does not change the Transform positions of the GameObjects themselves.

Also set Move X/Y/Z in Edit > Snap Settings to 1 ÷ PPU. See our Pixel Perfect Camera article for details.

Pixels turn into fine diagonal lines when rotated

When you rotate a pixel art Sprite, diagonal lines can be drawn at a higher resolution than the original pixels, and the pixel art look is lost. The official documentation explains that setting Grid Snapping to Upscale Render Texture renders diagonal lines at the original resolution, and the pixels stay upright and square.

Cause 6: The source image itself

Even if every setting in Unity is correct, the result will not look clean if the image was already degraded before you imported it.

• It was saved as a JPEG: JPEG uses lossy compression and adds noise around edges. Save pixel art as PNG.
• An enlarged image was used as the source: An image enlarged in a drawing program with interpolation already has smeared pixels. Unity does the enlarging, so import the artwork at its original size.
• The image was converted between formats many times: Passing through a lossy format reduces quality with every conversion.

For the differences between image formats, see Image Formats Compared: PNG, JPEG, WebP, and More for Game Development.

A checklist to work through in order

If you cannot tell what the cause is, check the following in order.

1. Is the Game view Scale set to 1x? Does the built game look the same?
2. Is the Sprite’s Filter Mode set to Point (no filter)?
3. Is Compression set to None?
4. Is Non-Power of 2 set to None, and is Generate Mipmap turned off?
5. Do the camera’s Assets Pixels Per Unit and each Sprite’s Pixels Per Unit match?
6. Does the Reference Resolution fit the monitor resolutions you want to support as a whole-number multiple?
7. If it only breaks when moving, check Grid Snapping and Snap Settings.
8. Is the source image in a lossless format such as PNG, at its original size?

Check with our tool

Our Pixel Perfect Camera Preview tool lets you enter PPU and Reference Resolution values and check the scale for each monitor resolution, and whether Sprite sizes align with the pixel grid. You can also change the PPU of each Sprite to see how the distortion looks, which is useful for checking Cause 4. If you need to convert an image to another file format, you can also use our Image Format Converter.