Free Online Image Annotator Tool

What Is It?

The Free Online Image Annotator is a powerful, browser-based utility designed for machine learning engineers, data scientists, and developers. It allows you to quickly and privately draw precise bounding boxes on images to create datasets for object detection models, such as YOLO or Faster R-CNN. The tool is highly intuitive, running entirely in your browser with zero server contact—meaning your sensitive datasets remain 100% private.

How to Use

1. Click Upload Images or use the Add button in the sidebar to load your dataset (JPEG, PNG, WEBP) directly into the browser.
2. Select the Draw tool (shortcut: D) and click-and-drag across the image to create a bounding box.
3. Use the Edit tool (shortcut: V) to select existing boxes, resize them using the corner/edge handles, or move them around.
4. Add new labels using the Classes section in the left sidebar. You can customize the name and color of each class.
5. Double-click a class name in the sidebar to rename it.
6. Switch between images in your dataset using the Prev and Next buttons.
7. Once finished, export your annotations instantly via the JSON (COCO-like) or YOLO (.txt Zip) buttons.

Key Features

• 100% Client-Side Processing — Your images and data never leave your computer. Everything happens instantly in the local memory of your browser.
• Auto-Saving Sessions — Accidentally closed the tab? The annotator auto-saves your progress to your browser’s local storage.
• Export Formats — Supports standard outputs natively. Generate COCO-style JSON arrays or YOLO-compatible normalized coordinates.
• Dynamic Styling — Colors automatically calculate contrast so your class labels are always perfectly readable against the bounding box.

Advanced Usage & Tools

Effortless Keyboard Shortcuts

Professional annotation requires speed. Our tool is built with power users in mind, offering a suite of hotkeys to accelerate your workflow:

• D: Switch to Draw mode.
• V: Switch to Edit/Select mode.
• Ctrl+Z / Cmd+Z: Undo your last action.
• Ctrl+Y / Cmd+Y: Redo an action.
• Delete / Backspace: Remove the currently selected bounding box.
• F: Toggle Full Screen mode for distraction-free labeling.

Seamless Class Renaming

Unlike many web-based annotators that force you to delete and recreate labels simply to fix a typo, NotepadPlusPlus allows for inline renaming. By double-clicking any class in your left sidebar, you can modify the name on the fly. All existing bounding boxes on your canvas—and those in your pending exports—will be updated instantly and automatically.

Technical Implementation Details

Zero-Knowledge Architecture

The NotepadPlusPlus Image Annotator processes massive high-resolution images rapidly using modern HTML5 Canvas native APIs. Files loaded into the tool are converted into temporary memory Blob URLs, meaning no upload latency or bandwidth limits. This Zero-Knowledge Architecture guarantees absolute privacy for proprietary corporate datasets or sensitive medical imaging.

Export Normalization

When exporting to YOLO format, the tool automatically calculates normalized coordinates bounding boxes. It translates raw pixel coordinates (X, Y, Width, Height) into ratio-based measurements (center_x, center_y, width_ratio, height_ratio) scaled strictly from 0.0 to 1.0, ensuring immediate compatibility with PyTorch, Darknet, or Ultralytics model training pipelines.

Frequently Asked Questions

Are my images uploaded to a server?

No. The Image Annotator operates entirely locally using your browser’s JavaScript engine. Your images are never transmitted over the internet, keeping your datasets secure, private, and offline.

What export formats do you support?

Currently, the tool supports two of the most popular computer vision formats: JSON (COCO-like) which maps images, categories, and bounding boxes to specific IDs, and YOLO format, which generates a concatenated mapping text string grouping normalized coordinates by class index.

Does the annotator support segmentation masks or polygons?

Currently, this tool is heavily optimized for high-speed Bounding Box annotation for object detection models. Polygon mapping for instance segmentation is planned for a future release.

Is the session auto-saved if I refresh the page?

Yes. As you draw bounding boxes, your workspace metadata is quietly saved to your browser’s localStorage. If you accidentally close the tab, simply upload the exact same images again, and the system will automatically map and restore your previously drawn boxes.

Can I rename a class after drawing boxes with it?

Absolutely. Double-click the class name in the left panel to trigger the inline editor. When you save the new name, all existing bounding boxes and scheduled exports will automatically update to reflect the change.