Every platform that shows a profile picture shows it as a circle. You upload a square; the app masks it. That mask is the whole problem, because a ring drawn at the edge of the square is stroked centred on the line the mask cuts along — so the outer half of the stroke lands outside the circle and is discarded.
We measured it by stroking a ring, applying the circular mask, and counting the surviving pixels across the centre line:
| Avatar | Ring asked for | Ring that survives |
|---|---|---|
| 400 px | 20 px | 10 px |
| 400 px | 40 px | 20 px |
| 1000 px | 60 px | 30 px |
Exactly half, every time, at every size. And it does not read as broken — it reads as a thinner ring than you chose, which is why nobody investigates. You just quietly get a different design from the one you made.
Stroke the ring at a radius of R − W/2 instead of R, and the entire width falls inside the circle. Measured the same way: 20 px asked for, 20 px surviving; 40 for 40; 60 for 60. This tool does that, and shows you the third panel above — the same settings drawn the usual way, after the crop — so you can see the difference rather than take our word for it.
A circle inscribed in a square covers π/4 of it. Counting surviving pixels after the mask gives 21.46 % of the image gone, identical at 400 px and at 1000 px, which is exactly 1 − π/4. The corners are never yours. Anything you care about — a face, a logo, text — has to sit inside the inscribed circle or it is not in the picture.
A ring then eats inward from what is left:
| Avatar | Ring | Photo left | Photo hidden |
|---|---|---|---|
| 400 px | 8 px | 384 px | 7.8 % |
| 400 px | 20 px | 360 px | 19 % |
| 400 px | 40 px | 320 px | 36 % |
| 1000 px | 60 px | 880 px | 22.6 % |
That is why the ring width here is a percentage of the avatar rather than a pixel count. A 5 % ring looks the same on a 400 px export and a 1500 px one; 20 px does not.
How those pixels were counted, and the code that counted them, is written up in Half your profile picture ring is thrown away, and nothing tells you.
Because the corners are masked away anyway, the honest export leaves them transparent — what you see is what every platform will show. But a few places do not crop to a circle: some forums, some chat apps, and the large version of the picture on a profile page. There, transparent corners show as whatever that page's background is, which can look like a mistake. If you are posting somewhere that might show the square, fill the corners with the ring colour, white or black instead.
No. The file is read by your browser, drawn on a canvas in the page, and handed back to you as a download. It never reaches a server, which is also why it keeps working with the tab offline once the page has loaded.
Because it is. A ring stroked at the edge of the square is cut in half by the circular crop — measured at exactly half, at every size we tried. Inset the stroke by half its width and the whole ring survives. That is the only difference.
800 × 800 is comfortably above what any major platform displays, so it survives their downscaling with detail to spare. Going to 1500 costs file size and buys nothing unless the platform shows a large version on the profile page.
So the design survives a change of export size. A 20-pixel ring is bold at 400 px and nearly invisible at 1500 px; 5 % is 5 % at both. The tool shows you the pixel width it works out to.
Usually yes — they are masked away, so transparency is the honest file. Fill them only if you post somewhere that shows the square uncropped, where transparency would take on that page's background colour.
Yes, and it matters more there: a logo with a tight bounding box loses its corners to the circle. Leave padding around the mark, keep the ring thin, and check the round preview rather than the square one.
Yes. The drawing is done by the same canvas the desktop uses. Very large photos are limited by the browser's memory rather than by the tool; if a download comes back blank, resize the photo first.
Not here — the export is a still PNG. Most platforms flatten an animated avatar to its first frame anyway, so the practical answer is to export that frame and ring it.