WordPress Image Size Calculator
Enter an original image size and a target display width to see the dimensions WordPress would produce. Add your own sizes and copy ready-to-paste add_image_size() lines and a matching srcset sizes hint. Runs in your browser.
| Name | Target W × H | Output for this image | Mode |
|---|
About the WordPress Image Size Calculator
The WordPress Image Size Calculator shows the dimensions WordPress would produce from a source image at a given display width, for both soft (proportional) scaling and hard crop. Enter the original width and height, a target display width, and a crop mode to see the scaled result, then add your own named sizes. It generates ready-to-paste add_image_size() lines and a matching srcset sizes hint. Everything runs in your browser, so no image is uploaded and nothing is stored.
How it works
- Enter the original image width and height, then set a target display width and pick soft or hard crop.
- Read the scaled output WordPress would generate; soft scale keeps the aspect ratio, hard crop trims to the exact box.
- Add custom sizes with a name, width, height, and crop flag to build your full list of registered sizes.
- Copy the add_image_size() lines for functions.php and the srcset sizes hint for your templates.
Features
- Live calculation that updates as you type, with no button to press.
- Soft (proportional) and hard crop modes that match how WordPress resizes.
- No upscaling, so a target wider than the original returns the original size, the same as WordPress.
- Custom size builder with a table showing target dimensions, output for your image, and resize mode.
- Copy-ready add_image_size() snippet plus a srcset sizes attribute hint built from your widths.
Frequently asked questions
How does WordPress decide the output size?
For soft sizes, WordPress scales the image down to fit within the width and height box while keeping the aspect ratio, and never enlarges it. For hard crop, it trims the image to the exact width and height. This tool uses the same rules.
What is the difference between soft and hard crop?
Soft scaling keeps the original aspect ratio and fits the image inside the target box, so the result can be smaller than the box on one axis. Hard crop forces the exact target dimensions by cutting off parts of the image, so the aspect ratio is not kept.
Why does my output match the original size?
WordPress does not upscale images. If your target width or height is larger than the source, the original size is used, and the row is marked as no resize.
What is the srcset sizes hint for?
The sizes attribute tells the browser how wide the image will display so it can pick the right file from srcset. The tool builds a sizes value from your registered widths as a starting point; adjust the breakpoints to match your layout.
Do I need to regenerate thumbnails after adding a size?
Yes. add_image_size() only affects images uploaded after it is added. To create the new size for existing images, run wp media regenerate with WP-CLI or use a thumbnail regeneration plugin.