Image Map Generator
Choose an image, add bounded rectangles with labels and safe URLs, then copy the responsive HTML.
Add up to 50 rectangular areas in source-image pixels.
A QUICK WALKTHROUGH
How to use this tool
- Choose an image and enter its alternative text.
- Add rectangle coordinates, a label, and a destination URL.
- Review the accessible named map and copy the HTML.
Rectangles in source pixels
Each area uses left, top, width, and height in the original image pixel coordinate system. The generated image map remains usable when CSS resizes the image because HTML image-map coordinates scale with the rendered image.
Safe accessible output
Labels become area alt text, the image requires non-empty alt text, and URLs are limited to http(s) or same-page relative destinations. HTML is escaped before export.
Bounded local processing
The image is read in your browser. Inputs are limited to a 20 MB image, 50 areas, and 10,000-character output.
GOOD TO KNOW
Common questions
Are my images uploaded?
No. The image metadata and generated HTML stay in your browser.
Which shapes are supported?
This version exports rectangular areas only.
Why are coordinates in pixels?
Pixel coordinates make the map repeatable from the original image; the browser scales them with the responsive image.