Shapes & arrows
Overlay a rectangle and an arrow.
This runs in your browser. Nothing is uploaded.
About Shapes & arrows
Draws a hollow rectangle with a horizontal arrow across its middle, positioned by X, Y, W and H sliders, rendered in your browser for pointing at things in screenshots.
Most screenshots need a box around the thing you are talking about. Bug reports, design feedback, a note to a colleague about which field is broken — the annotation is what makes the image useful, and without it you end up writing a paragraph describing where to look.
Four sliders place the shape in the image's own pixel coordinates. X and Y set the top-left corner, W and H the size. The rectangle is stroked at four pixels in the colour you pick, and an arrow runs from its left edge to its right edge at half its height, in the same colour, with a head scaled to the smaller of the two dimensions. Both are outlines; nothing is filled.
Be clear about what you are getting. The arrow only ever points right, and there is no ellipse, despite what the word shapes suggests. Applying a second time redraws from the original image, so you get one rectangle per pass rather than a set. For anything freeform, or for several marks at once, the brush is the better tool.
How to use Shapes & arrows
- 1Drop the screenshot onto the panel.
- 2Set X and Y for the top-left corner, then W and H for the size. All four are in image pixels.
- 3Pick a colour, click Apply, and check the placement in the preview.
- 4Click Download to save the marked-up copy.
What it won't do
- One rectangle and one line per pass; applying again discards the previous shape.
- No ellipses, no filled shapes, and the arrow only points right.
- Outline thickness is fixed at four pixels regardless of image size.
Common questions
How do I put an arrow on a screenshot?
It draws one arrow, running left to right through the middle of the rectangle you position. There is no way to change its direction, so if you need to point up, down or diagonally, use the freehand brush instead — you can draw an arrow at any angle in a couple of strokes.
Can I draw a circle or an ellipse?
No. Only a rectangle outline and the arrow are available here, even though the tool is named for shapes generally. Circling something is best done with the brush, which follows your pointer and will happily produce a rough ellipse around whatever you want to highlight.
Why can't I drag the box directly on the image?
Placement on this tool is by slider rather than by pointer. Read the coordinates off the image info tool or the eyedropper, which reports the x and y of whatever you click, then set the sliders to match. The drawing and signature tools do take pointer input on the image itself.
Can I add several boxes to one screenshot?
Not in one pass. Each Apply redraws the shape onto a fresh copy of the original, so the previous rectangle disappears. To stack annotations, download the result and drop that file back in as the new source, then place the next box.
Related tools
Why this one doesn't upload your file
There is no server to upload to. This page is a static file, and the work happens in your browser using the same graphics and WebAssembly code that renders every other site you visit. Your file is read from disk into memory, processed, and handed back as a download. Once the page has loaded you can disconnect from the network entirely and it keeps working. The longer explanation