Guides
How to Resize Images for the Web Without Blurring Them
Practical tips for resizing images so they stay sharp at any target dimension.
Rook Dev Studio•4 min read•
Downscaling vs upscaling
Shrinking an image (downscaling) almost always looks clean. Enlarging a small image (upscaling) stretches existing pixels and introduces blur — it's best avoided unless the source image is high resolution to begin with.
Keep the aspect ratio locked
Stretching an image to fit an arbitrary width and height distorts faces and objects. RookImg's Resize tool locks the aspect ratio by default so your image keeps its natural proportions.
Common web-safe sizes
Hero banners often work well around 1920px wide, blog thumbnails around 800px, and profile photos around 400px — resize once for its final use case rather than relying on the browser to scale it down.