Skip to content
ImgKiloImgKiloOpen tools

Add Arrow to Image

Add an arrow to an image

Drop an image and an arrow appears, ready to aim: drag either end to point it, or the middle to move it. Add as many arrows as you need, and combine them with text labels, highlight boxes, speech bubbles and numbered steps for a complete markup. Every mark is independently editable. Download as PNG or JPG, all in your browser, with nothing uploaded.

  • Files never leave your device
  • Runs in your browser
  • Free, no signup

How it works

  1. 1

    Drop an image

    Add a JPG, PNG, WebP, GIF or AVIF. It is drawn to a canvas in your browser, with no upload.

  2. 2

    Aim it, add more

    Drag each end to point it, or the middle to move it. Add more arrows, text, boxes, bubbles and steps from the panel.

  3. 3

    Style and save

    Set the colour, thickness and outline, pick one or two heads, then download as PNG or JPG.

What this markup tool gives you

Stack arrows and more

Add as many arrows as you need, plus text labels, highlight boxes, speech bubbles and numbered steps, all on one image.

Aim and restyle each mark

Drag either end of an arrow to point it, and set the colour, thickness, one or two heads, a dashed line and opacity per mark.

Drawn locally, never uploaded

The image and every mark are composited in your browser, so screenshots and private photos never touch a server.

Where this helps

How-to

Tutorial screenshots

Point at the button, menu or field a reader needs to click in a step-by-step guide.

Work

Bug reports and feedback

Mark the exact spot that is broken or needs changing so there is no ambiguity.

Photos

Highlighting a detail

Draw the eye to one thing in a busy photo, like a face in a crowd or a sign.

Diagrams

Distances and links

Use a double-headed arrow to show a span between two points or a two-way relationship.

Tips that help

  • 1

    Travel from empty to target

    Start the tail in open space and end the head on the target, so the arrow is easy to follow.

  • 2

    Stop just short

    Leave a small gap before the target rather than covering it, so the thing you point at stays visible.

  • 3

    Keep the outline on

    The contrasting halo is the easiest way to keep a coloured arrow legible over any background.

  • 4

    Bigger on busy images

    Raise the thickness on large or cluttered photos so the arrow carries across the detail.

Adding an arrow to an image: pointing the eye where it needs to go

An arrow is the most direct way to say 'look here'. It turns a plain screenshot into an instruction, marks the one detail that matters in a busy photo, and guides a reader through a step without a word of explanation. Doing it well is about aiming it precisely and keeping it visible, which is what this guide covers.

Aim it precisely

Start the tail in a calm, empty part of the image and let the head land on the thing you are pointing at. An arrow that begins over clutter and ends in more clutter is hard to follow; one that travels from open space into the target reads instantly.

Add an arrow to an image

Leave a small gap between the head and the target rather than burying the tip in it. Pointing at a button is clearer when the arrow stops just short and lets the button stay visible, instead of covering the very thing you want someone to see.

Because the position on the canvas is exactly the position in the download, drag the ends until it looks right against the real image rather than guessing. Both ends move independently, so you can adjust the angle and length until the arrow feels deliberate.

Keep it visible over any background

Colour does most of the work. A saturated red or yellow stands out against the greys and skin tones of most screenshots and photos, while a colour that blends into the background defeats the point of an arrow.

The outline is the other half. It wraps the arrow in a thin contrasting halo, so a white arrow stays readable over a bright wall and a dark arrow over a shadow. On a genuinely busy image it is the difference between an arrow that pops and one that disappears.

Match the thickness to the image size. A thin arrow is fine on a small, clean screenshot, but a large or noisy photo needs a heavier line and a bigger head to carry across the detail.

Read more

What to pair an arrow with

An arrow shows where; a few words say what. Pair it with a short caption from the add text tool to label the thing it points at, which is the classic recipe for a tutorial screenshot.

When the note is a quote or a reaction rather than a label, a speech bubble with a tail does the same pointing job while carrying the words inside it.

If the same screenshot also contains something private, mark it up first and then hide the sensitive part by blurring the area, so the finished image both guides and protects.

Frequently asked questions

Honest answers to what people ask before using this tool.

Further reading

Independent references if you want to go deeper on the formats and tradeoffs.

Related tools