Why Rotating an Image by a Non-Right Angle Makes the Canvas Bigger

Guide · Last verified Aug 27, 2026

Rotate a photo by exactly 90° and nothing weird happens — width and height simply swap. But rotate a scanned document by a small correction angle like 3°, or spin a photo by 45°, and you'll notice the resulting canvas is noticeably larger than the original. Why does mere rotation change the image's dimensions at all? The answer is that "what actually gets rotated isn't the image — it's the rectangle that contains it."

1. Rotation tilts a rectangle

An image is always a width×height rectangle. Rotate that rectangle around its center by an angle θ, and its four corners rotate along with it, ending up as a diamond shape no longer aligned with the original horizontal/vertical axes. But the canvas that gets displayed or saved to a file must always be an axis-aligned rectangle. So to hold the whole tilted diamond without cropping anything, you need a new axis-aligned rectangle that fully encloses it — the bounding box. This bounding box is always greater than or equal to the size of the original rectangle — exactly when it grows is the subject of the next section.

2. The bounding box size is computed with cos and sin

Let the original image's width be w, height be h, and rotation angle be θ. The new width and height of the bounding box enclosing the rotated rectangle are given by:

This formula expresses, using trigonometry, the maximum width and height occupied when the rotated rectangle's four corners are each projected onto the x-axis and y-axis. The closer the angle is to 0°, the closer sin θ is to 0, so the bounding box stays close to the original size; the closer it gets to 45°, the larger both cos and sin become, and the bounding box swells to its maximum.

Checking the actual source code of the image rotator tool confirms this exact formula is implemented. It converts the angle to radians, takes the absolute value of cos and sin, computes the canvas's new width and height as ow*cos+oh*sin and ow*sin+oh*cos, and rebuilds the canvas itself to that size. In other words, instead of "keeping the original size and cropping the corners," it dynamically widens the canvas itself to match the rotation result — eliminating clipping at the source.

3. Checking the numbers: rotating an 800×400 image by 30°

Rotate an 800px-wide, 400px-tall rectangular image by 30° and the math works out as follows.

The original was 800×400 (width twice the height); after rotation it becomes 893×746 — width grows by about 12%, while height grows by nearly double. Height grows so much more because the originally-short vertical dimension now has to absorb the original horizontal component (800×sin30°=400px) as well.

4. Why 90°, 180°, and 270° don't grow the canvas

Plug those exact angles into the same formula and the reason is immediately obvious. At 90°, cos(90°)=0 and sin(90°)=1, so nw = w×0 + h×1 = h and nh = w×1 + h×0 = w — width and height simply swap exactly, with no growth. At 180°, cos=-1 and sin=0, so nw=w and nh=h, meaning the canvas stays exactly as the original. Right-angle rotations aren't special in any deep sense — they just happen to be the points where cos and sin land exactly on 0 or 1, so the bounding box coincidentally matches the original. 45°, by contrast, is where cos and sin are both close to their maximum (about 0.707 each), making it the angle where the bounding box swells the most.

5. Empty corners and the file-format trap

Since the bounding box is larger than the original, empty space appears in the four corners between the rotated rectangle and the new canvas. This region is left fully transparent (alpha 0) by default when the canvas is initialized, so saving as PNG naturally produces transparent corners. The trap is saving that result as JPG, which doesn't support transparency — the transparent corners can turn black. The mechanics of this exact trap are covered in detail in the guide Why Transparent Images Turn Black When Converted to JPG. If you need to composite the rotated result onto another background, post-processing it with the transparent background maker tool is another option.

6. Practical tip: correcting a tilted document scan

When straightening a scanned document with a small correction rotation, the angle used is usually only around 1-5°, so the bounding-box expansion is small too. Still, it's worth building the habit of trimming the resulting image with the image cropper tool to remove margins, or verifying the final pixel dimensions with the image dimension checker tool — it reduces surprises from unexpected canvas sizes in downstream steps like printing or uploading.

Frequently Asked Questions