Image Layout Toolkit

The free proportional image element scaler for layouts.

Upload a parent image, set a target size, then drop in child elements to get every asset’s new relative dimensions in real time. Runs entirely in your browser.

Open the scalerSVG to PNG

1. Mother Image

The parent frame whose size you’re changing. Its scale factor drives every element.

Drop the Mother Image here

or click to browse — PNG, JPG, GIF, WebP, SVG

2. Elements & new dimensions

Upload one or more images. Each new width and height updates in real time — no button to press.

Drop single or multiple images here

click to browse — they’ll list below with their new size

No elements uploaded yet.

Scale every element in a layout by the same ratio

When you resize a banner, an artboard, or an email header, the graphics inside it have to move with it. Eyeballing each one is slow and error-prone. This proportional image element scaler turns that job into arithmetic: it reads the parent’s original size, compares it to your target size, and applies the resulting horizontal and vertical scale factors to every child asset. As a relative image resizer online and responsive image dimensions calculator, it gives you exact pixel values instead of guesses — and they update the instant you change the target.

Drop in a whole set of assets and the batch element scaling tool measures each automatically, listing original and new dimensions together — a multi-image layout dimension calculator that keeps your whole composition in proportion. Because it treats the Mother Image as the reference frame and every asset as a dynamic bounding box, it doubles as a parent child image resizing web app and a proportional layout size finder. Lock the aspect ratio for a clean uniform resize, or unlock it when you deliberately want independent horizontal and vertical scaling.

Whether you use it as a graphic design asset ratio converter, a UI asset relative scaling tool, a canvas ratio asset calculator, or a dynamic bounding box resizer, everything runs locally in your browser — no uploads, no signup, nothing leaves your device.

Proportional Image Element Scaler FAQs

A proportional image element scaler is a browser tool that resizes a set of smaller graphic elements by the exact same ratio you use to resize a larger parent image. You upload a "Mother Image", type the target width and height you want it displayed at, then drop in any number of child element images. The tool derives a horizontal and vertical scale factor from the parent and applies it to every child, so each element keeps its correct relative size and position inside the layout.
The relative image resizer online works with two scale factors. The horizontal factor is the target width divided by the original width (SFx = W_target / W_orig) and the vertical factor is the target height divided by the original height (SFy = H_target / H_orig). Each element’s new width is its original width times SFx, and its new height is its original height times SFy. Because the same responsive image dimensions calculator math is applied to every asset, the whole composition scales in lockstep.
Yes. This is a batch element scaling tool — drop one file or dozens into the elements zone and each is measured automatically. The multi-image layout dimension calculator lists every asset with its original dimensions and its new relative dimensions side by side, updating in real time as you change the target size. You can copy any single result or remove elements you no longer need without re-uploading the rest.
It can. With the aspect-ratio lock enabled, editing the target width auto-fills a matching target height (and vice versa) so the parent frame never distorts. That makes it a reliable proportional layout size finder: lock the ratio for a clean uniform resize, or unlock it to stretch width and height independently when you deliberately want different horizontal and vertical scale factors.
The Mother Image is the parent canvas — the full artboard, banner, or bounding box whose size you are changing. The chunk elements are the child assets that live inside it: buttons, icons, logos, product shots, badges. This parent child image resizing web app treats the mother image as the reference frame and every chunk as a dynamic bounding box that must move with it, which is exactly how a real responsive layout behaves.
No. This UI asset relative scaling tool runs entirely client-side in your browser. Files are read locally with the FileReader and Image APIs and every calculation happens on your device — nothing is sent anywhere. That makes this graphic design asset ratio converter and canvas ratio asset calculator safe for confidential mockups, unreleased brand assets, and client work.