How to Resize an Image by Pixels Without Blurring Edges

The Core Problem: Interpolation Mismatch

Understanding how to resize an image by pixels requires abandoning the assumption that all software handles dimensional changes equally. When you alter the exact pixel dimensions of an image, the software must calculate new color values for the newly created (or destroyed) pixels. This calculation is governed by interpolation algorithms. Selecting the wrong algorithm for your specific image type—particularly in pixel art, UI design, and retro game assets—results in muddy gradients, blurred edges, and subpixel shimmering.

The fundamental rule of pixel management is that source intent dictates the algorithm. Photographic data relies on continuous tone interpolation, while pixel art and hard-edge graphics rely on discrete grid mathematics. Applying a continuous tone algorithm to discrete grid data destroys the original artist's manual anti-aliasing and introduces algorithmic noise.

Critical Warning: Never use 'Bicubic Automatic' or 'Bilinear' when resizing sprite sheets, tilemaps, or hard-edge UI icons. These algorithms average adjacent pixel colors, creating a halo effect (ringing) and destroying the exact hex values required for indexed color palettes.

The Mathematics of Pixel Scaling: Integer vs. Non-Integer

Before opening any software, you must calculate your scale factor. The relationship between your original pixel dimensions and your target pixel dimensions determines whether your image will retain perfect structural integrity or suffer from uneven pixel distribution (jaggies).

Calculating the Scale Factor

The formula is simple: Target Dimension / Original Dimension = Scale Factor. If the scale factor is a whole number (integer), every original pixel maps perfectly to a uniform block of new pixels. If the scale factor is a decimal (non-integer), the software must create fractional pixels, which is physically impossible on a standard raster grid.

Original Size	Target Size	Scale Factor	Resulting Grid Integrity
16 x 16 px	32 x 32 px	2.0x (Integer)	Perfect. Uniform 2x2 pixel blocks.
16 x 16 px	48 x 48 px	3.0x (Integer)	Perfect. Uniform 3x3 pixel blocks.
16 x 16 px	24 x 24 px	1.5x (Non-Integer)	Compromised. Alternating 1px and 2px widths causing visual stutter.
32 x 32 px	50 x 50 px	1.5625x (Non-Integer)	Severe distortion. Subpixel blurring mandatory to avoid missing data.

Algorithm Selection Matrix

According to the documentation on pixel-art scaling algorithms, different mathematical models serve distinct purposes. Use this matrix to select the correct resampling method in your software.

Algorithm	Best Use Case	Visual Output	Edge Case / Failure Mode
Nearest Neighbor	Pixel art, sprites, hard-edge icons, indexed color.	Crisp, hard edges. No new colors generated.	Creates severe 'stair-stepping' (jaggies) on non-integer scales.
Bilinear	Downscaling high-res photos, soft UI gradients.	Slight blur, smooths transitions between colors.	Destroys pixel art readability; creates muddy palettes.
Bicubic (Smoother)	Enlarging continuous-tone photographs.	High contrast, attempts to preserve edge sharpness.	Creates white/black halos (overshoot) around high-contrast edges.
Scale2x / EPX	Retro game emulation, upscaling 8-bit/16-bit assets.	Smart edge detection; smooths diagonals without blurring flat colors.	Can misinterpret intentional dithering as edges, creating artifacts.

Pro-Tip: The 'Scale-Up, Smooth-Down' Pipeline

What happens when a client or engine demands a non-integer size? For example, you have a pristine 32x32 pixel art asset, but the game engine's UI bounding box requires exactly 50x50 pixels. If you use Nearest Neighbor to go directly from 32 to 50, you get uneven pixel widths. If you use Bilinear, you get a blurry mess.

The Professional Workflow:
1. Scale the 32x32 image up by an integer (e.g., 3x) to 96x96 using Nearest Neighbor.
2. Scale the 96x96 image down to 50x50 using Bilinear or Bicubic Sharper.
Because you are downscaling from a massive, uniform pixel grid, the algorithm has enough redundant data to create a smooth, proportional shrink without destroying the core shapes. Alternatively, keep the source file at 32x32 and use CSS image-rendering: pixelated; combined with image-rendering: crisp-edges; in your web or UI framework to let the display hardware handle the non-integer scaling dynamically.

Software-Specific Execution Workflows

Knowing the math is only half the battle; executing it requires navigating specific software interfaces. Here is how to resize an image by pixels in the industry-standard tools for 2026.

Aseprite (v1.3+) Workflow

Aseprite is built specifically for discrete pixel grids. The official Aseprite sprite size documentation outlines the following path for lossless resizing:

1. Navigate to Sprite > Sprite Size (Alt+Ctrl+I).
2. Ensure the chainlink icon (Lock Aspect Ratio) is engaged to prevent stretching.
3. Enter your target Width or Height in pixels.
4. Crucial Step: In the Method dropdown, select Nearest Neighbor for pixel art, or RotSprite if you are simultaneously resizing and rotating (RotSprite minimizes subpixel artifacts during angular transformations).
5. Click OK. If your palette is indexed, verify that no new, unapproved colors were introduced (Nearest Neighbor guarantees this; Bilinear will not).

Adobe Photoshop Workflow

Photoshop defaults to photographic algorithms, making it hostile to pixel art unless configured correctly. The Adobe Image Size guide details the resampling engine, but you must manually override it:

1. Go to Image > Image Size (Alt+Ctrl+I).
2. Look at the Resample checkbox. If you only want to change the DPI/PPI metadata for print without altering the actual pixel dimensions, uncheck Resample.
3. If you are changing the actual pixel dimensions, check Resample.
4. Click the Resample dropdown menu and explicitly select Nearest Neighbor (Hard Edges). Do not leave it on 'Automatic'.
5. Enter your exact pixel dimensions in the Width/Height fields.
6. Click OK.

Troubleshooting Common Resizing Artifacts

Even with the correct algorithm, edge cases occur. Use this diagnostic list to identify and fix common pixel management failures.

• Symptom: 'Jaggies' or uneven line thickness on diagonal lines.
  Cause: Non-integer scaling with Nearest Neighbor.
  Fix: Recalculate your target dimensions to match a whole-number multiplier, or manually redraw the anti-aliasing pixels on the diagonal after scaling.
• Symptom: Dark or light halos outlining high-contrast shapes.
  Cause: Using Bicubic interpolation, which applies an unsharp mask-like overshoot to maintain perceived sharpness.
  Fix: Undo and switch to Bilinear (for photos) or Nearest Neighbor (for graphics).
• Symptom: Transparent edges turn semi-opaque or fringed.
  Cause: Interpolation algorithms calculate the RGB values of transparent pixels (which often default to black or white in the background buffer) and bleed them into the visible alpha channel.
  Fix: In Photoshop, use the 'Flame' or 'Pixel Art' specific scripts that pre-multiply alpha before resizing, or manually lock transparent pixels before applying transformations.

Final Verification

Always zoom in to 800% or higher after resizing. Inspect the borders of your subject. If you see a gradient of colors where there should be a hard boundary between two hex codes, your interpolation method was incorrect. Revert, adjust your algorithm, and recalculate your pixel targets to maintain absolute grid fidelity.