Skip to main content

Image Rotator

Rotate images by 90° steps or any custom angle, with auto-sized canvas bounds.

Written by Golam Rabbani, Founder & Lead Engineer

Rotation happens via canvas in your browser.

Clockwise. Use the presets or type any value.

How to use this image rotator

  1. Choose an image file from your device.
  2. Enter a rotation angle in degrees, or use one of the 90°, 180°, 270°, -90° preset buttons.
  3. Press "Rotate Image" to render the rotated image onto a canvas with auto-sized bounds.
  4. Preview the rotated output and click "Download" to save it locally.
  5. Adjust the angle and re-run if you want a different orientation.

About this image rotator

An image rotator turns a picture around its centre by any angle. The most common cases are the 90° steps that fix sideways phone photos and the arbitrary angles designers use to straighten a tilted horizon or skew a graphic for a layout.

This tool computes the new bounding box (using the absolute sin / cos of the angle), creates a canvas at exactly that size, translates the canvas origin to the centre, rotates by the requested angle, and draws the source image centred at the new origin. Because the canvas is sized to the rotated bounds rather than the original dimensions, the rotated image is never clipped at the corners.

Everything runs locally in your browser. The source file is decoded with createImageBitmap, the rotated render happens on an off-screen canvas, and the result is encoded back to a blob — no network round-trip occurs and your image never leaves the tab.

As a worked example, rotating a 1920 × 1080 px landscape photo by 90° produces a 1080 × 1920 px portrait file. Rotating the same image by an arbitrary 15° produces a canvas roughly 2134 × 1857 px, with transparent corners around the rotated photo (assuming a format that supports alpha — PNG or WebP). For JPEG output the corners become black; convert to PNG first if you want transparency.

FAQ

Are my images uploaded anywhere during rotation?
No, rotation happens entirely in your browser using the canvas API. The source image is decoded, rotated, and re-encoded locally with no network requests.
Why do my corners turn black after rotating?
JPEG has no alpha channel, so the transparent rotated corners are filled with the canvas background (black by default). For transparency, convert the source to PNG or WebP first and the corners will stay transparent.
What is the difference between 90° and -90°?
90° rotates clockwise (the top edge moves to the right). -90° rotates counter-clockwise (the top edge moves to the left). 180° flips the image upside down via rotation.
Does rotation degrade image quality?
90°, 180°, and 270° rotations are lossless — they just rearrange pixels on integer boundaries. Arbitrary angles require resampling and slightly soften the image, especially around sharp edges.
Can I rotate by more than 360°?
Yes, but it has no visual effect. The tool accepts any numeric value, including negative values for counter-clockwise rotation and large values that are equivalent modulo 360°.