Image dimension scaler — a pure planning tool
Plan a proportional resize without ever stretching an image. This is a
calculation tool for designers and developers who need the exact target width and
height before exporting from an editor, writing a responsive srcset, or
setting up a CDN image transform. It performs pixel math only — no image is
loaded, processed, or uploaded.
How it works
The tool stores the aspect ratio as ratio = originalWidth ÷ originalHeight
and then solves for the missing dimension based on your chosen mode:
- By percentage:
outWidth = round(width × pct/100),outHeight = round(height × pct/100). - By target width:
outHeight = round(targetWidth ÷ ratio). - By target height:
outWidth = round(targetHeight × ratio).
Results are rounded to whole pixels. Because integer rounding can shift the effective ratio by a sub-pixel fraction, the displayed output ratio may read as 16:8.99 instead of 16:9 — that is expected and invisible in practice.
Examples
Starting from a 1920×1080 image (16:9):
| Mode | Input | Result |
|---|---|---|
| Percentage | 50% | 960 × 540 |
| Percentage | 25% | 480 × 270 |
| Target width | 1280 | 1280 × 720 |
| Target width | 800 | 800 × 450 |
| Target height | 360 | 640 × 360 |
Starting from a portrait photo 2448×3264 (3:4):
| Mode | Input | Result |
|---|---|---|
| Target width | 1200 | 1200 × 1600 |
| Target height | 500 | 375 × 500 |
| Percentage | 33% | 808 × 1077 |
Common workflows that use this tool
Responsive image srcset planning. If your layout shows images at 1200px,
800px, and 400px wide breakpoints, calculate the matching heights for each
breakpoint before exporting three versions from your editor. The math is trivial
but easy to get wrong under pressure.
CDN image transforms. Services like Cloudinary, Imgix, and Cloudflare Images accept explicit width and height parameters. Pre-calculate them here to avoid accidentally introducing slight stretching by supplying unmatched dimensions.
Social media cropping. Most platforms have fixed dimension requirements. Start with your original photo dimensions here, calculate the percentage you need to scale to hit the target width, and then crop (rather than squish) the height to fit.
Why pixel rounding matters
When you scale a 1920×1080 image to 33%, the precise result is 633.6×356.4 pixels.
Because pixels must be whole numbers, this rounds to 634×356. But 634÷356 = 1.781,
while 1920÷1080 = 1.778 — the ratio has shifted by 0.003. In practice this is
invisible, but if you are building a pixel-perfect layout or a srcset where
multiple images need to tile without gaps, rounding drift across several sizes
can matter. A better approach is to work from ratios to a common denominator, or
choose percentages that produce clean whole-number outputs: 50%, 25%, and 75%
are cleaner than 33% or 67% for most starting dimensions.
The tool displays the exact rounded result for each calculation so you can see whether the rounding has introduced any visible ratio shift before you export.
No image file is needed — just enter the width and height and run the calculation entirely in your browser.