Avatar frame maker

Drag straight across the preview. Hold the mouse down and move in the direction you want the photo to shift; on a phone, put a finger on the image and drag - the gesture does not scroll the page.

If dragging still does not reach, the source photo is too wide: raise the Zoom slider to make the face bigger, then drag again. Zoom and position are stored as a fraction of the canvas, so changing the output size keeps the same layout.

A grey and white chequerboard is the usual way of showing that an area is transparent rather than white. The downloaded PNG keeps that transparency, so the avatar sits on a dark or light background without a white square showing around the circle.

Pick the Upload your own type and hit Choose a frame file. The frame should be a square PNG with a transparent middle - that transparent area is where the face shows through.

A JPG will load, but it has no transparency, so it covers the portrait completely. The frame does not have to match the output size; it is scaled to the square for you.

Facebook, Zalo and most social networks compress profile pictures to something much smaller, so 512 × 512 is plenty and gives a lighter file. Go for 1024 × 1024 when the image has another job as well - a printed badge, a website, or a large slot on a high-resolution screen.

The text follows the bottom arc of the circle, and that arc only has so much room. Once the string is longer than the space available, the tool scales the type down to fit instead of letting it wrap all the way round and overlap itself. For larger, more legible text, shorten the line or increase the ring thickness.

The three seasonal templates - Lunar New Year, Vietnamese flag, Mid-Autumn - use fixed palettes so they look right for the occasion. The Plain ring template is the one that opens three colour pickers: two for the gradient on the band and one for the text, which is what you want for brand colours.

Yes. The output is a square PNG at the 1:1 ratio those platforms expect, and the circle already sits inside that square, so the frame survives when the platform crops the avatar to a circle. Do check the small version on a phone afterwards - a long line of ring text can be hard to read at a few dozen pixels.

Yes, the tool runs in a mobile browser and the drag gesture works with a finger just as it does with a mouse. Photos from recent phone cameras are often heavy; if one goes over 10 MB the tool says so, and you can pick a lighter copy or shoot at a lower resolution.