HTML image maps let you turn different parts of one image into separate clickable links using coordinates. Each clickable region is defined with an <`area`> tag inside a <`map`> that is linked to your <`img`>.

For each <`area`>, you set a shape and coords:

- rect: coords="x1,y1,x2,y2" (top‑left and bottom‑right corners)
- circle: coords="x,y,radius" (center point and radius)
- poly: coords="x1,y1,x2,y2,...,xn,yn" (points of an irregular shape)

The numbers are pixel positions from the top‑left corner of the image. With just these coordinates plus an href on each <`area`>, you can turn diagrams, maps, or menus into rich, interactive navigation.