Image Marker & Coordinate Annotator
Pin interactive markers with titles and descriptions onto any image. Export exact percentage coordinates as JSON. 100% private — files never leave your device.
Image Marker
Upload an image, place markers, and export coordinates.
Upload your image to get started
Support for JPG, PNG, and WebP.
How to Annotate Images & Export Coordinates
1. Upload Image: Drag and drop your screenshot, diagram, floor plan, or photo. The image renders in-memory in your browser.
2. Place & Edit Pins: Click anywhere on the image to place a marker pin. Add custom titles, notes, or descriptions in the marker inspector panel.
3. Export Coordinates JSON: Click Export JSON or copy coordinates to clipboard. Output coordinates use normalized percentage offsets, ensuring pins align perfectly on responsive screens.
100% Private, Client-Side Image Annotation
Unlike cloud annotation tools that require server uploads and account registrations, Multi-Toolkit Image Marker runs entirely within your browser via the HTML5 File API and Canvas. Your images, coordinates, and notes never touch any remote server.
Frequently Asked Questions
What does Image Marker do?
Image Marker lets you upload any image and place clickable markers on it. Each marker can have a title and description. When you are done, export all marker coordinates and metadata as a clean JSON file.
What format does the exported JSON use?
Each marker exports as an object with x and y coordinates (calculated as percentage offsets of image width/height so they scale across responsive display sizes), plus the title and description you entered. The full export is an array of these objects.
Are my images uploaded to a server?
No. Image Marker runs entirely in your browser using the HTML5 File API. Your images never leave your device and are never uploaded to any server. All annotations and coordinates remain private.
What are the main use cases for Image Marker?
Common uses include UX research (marking usability issues on screenshots), QA bug reporting (annotating visual defects), interactive floor plans, e-learning hotspots, architectural markup, and generating coordinate data for interactive image components in web apps.
Can I zoom in for precise marker placement?
Yes. Use the zoom in and zoom out controls on the toolbar to magnify high-resolution images and place pins with pixel-perfect accuracy.