Skip to content

Image Annotator

Annotate images in your browser with text, arrows, lines, rectangles, circles, freehand drawing and blur or pixelate areas. Change colour, thickness and font size, select, move and delete items, undo and redo, and export a flattened PNG or JPG.

Image Runs client-side Free to use
Jump to the tool
Share: X WhatsApp
Loading Image Annotator…

About the Image Annotator

Image Annotator lets you mark up a screenshot or photo directly in your browser. Add text, arrows, straight lines, rectangles, circles and ellipses, freehand pen strokes, and blur or pixelate rectangles to hide details. Choose the colour, line thickness and font size for each item, then switch to Select to click an annotation, drag it to a new place, resize shapes and lines by their handles, change its style or delete it. Undo and redo cover every change, and Clear removes all annotations at once.

Drawing works with a mouse, a pen or touch, and the editor also supports the keyboard: arrow keys move the selected item, Delete removes it, and Ctrl+Z and Ctrl+Y undo and redo. Annotations are stored at the image’s full resolution and drawn on a fresh canvas when you export, so the PNG or JPG keeps the original size and never includes selection boxes or handles. Exported annotations are flattened into the picture and cannot be edited later; JPG exports fill transparent areas with a background colour you choose.

How to use

  1. Choose or drop a PNG, JPG or WebP image.
  2. Pick a tool, colour, thickness or font size.
  3. Drag on the image to draw, or click to place text.
  4. Use Select to move, resize, restyle or delete annotations; undo and redo as needed.
  5. Export the annotated image as PNG or JPG.

Key features

  • Text, arrow, line, rectangle, circle/ellipse and freehand tools.
  • Blur or pixelate rectangles with adjustable strength.
  • Colour, thickness and font size controls.
  • Select, move, resize and delete; undo, redo and clear.
  • Mouse, pen, touch and keyboard support.
  • Full-resolution PNG or JPG export without handles; JPG background colour; Reset.

Best practices

  • Use a strong pixelate or blur setting — or a filled shape — for passwords and personal data.
  • Pick a colour that contrasts with the image so arrows and text stand out.
  • Keep text short and large enough to read on small screens.
  • Export PNG for screenshots with text; use JPG for photos.
  • Keep the original image if you may need to change the annotations later.

Benefits

  • Clear bug reports, tutorials and feedback.
  • Quick redaction of details before sharing.
  • Full-quality exports at the original size.
  • Private: the image never leaves your device.

Frequently asked questions

Can I edit annotations after exporting?

No. The exported PNG or JPG is flattened — annotations become part of the picture. Annotations stay editable only while the page is open, so keep the editor open or the original image if you may need changes.

Are selection boxes or handles included in the export?

No. The export is drawn on a separate full-resolution canvas containing only the image and the annotations.

Is blur or pixelation safe for hiding sensitive information?

It is a visual effect. Weak settings can leave large text readable, so use a high strength, or cover the area with a rectangle, for passwords, numbers and personal data.

Does it work on phones and tablets?

Yes. You can draw, drag and resize with touch. The page does not scroll while you draw on the image.

Can I use the keyboard?

Yes. Focus the image, then use the arrow keys to move the selected item (Shift for 10 px steps), Delete to remove it, Escape to deselect, Ctrl+Z to undo and Ctrl+Y to redo.

What size is the exported image?

The same as the original image. Annotations are stored at full resolution, so they scale correctly even though the editor shows a smaller preview.

Are my images uploaded anywhere?

No. Files are opened and processed by JavaScript running in your browser tab. Nothing is sent to a server, and images, SVG code and results are not saved in browser storage — they are cleared when you press Reset or close the page.