About resizing images
Exact dimensions for layouts
Design systems specify thumbnail sizes, avatar circles, and card images. Resizing to exact pixel dimensions prevents browsers from scaling unpredictably and reduces layout shift when dimensions are known ahead of time.
Maintain aspect ratio unless you intentionally crop; stretched faces and logos look unprofessional quickly.
Retina and responsive sets
Serving multiple resolutions via srcset lets crisp displays get more pixels without wasting bandwidth on low-density screens.
Pair resized raster assets with vector logos when possible so icons stay sharp at any zoom.
Quality control
Upsampling cannot invent real detail; enlarging small sources produces softness. Start from the highest-quality master you have.
After resizing text-heavy screenshots, zoom to 100% to confirm small type remains legible.