🎲 Token Maker: Round RPG and VTT Tokens
By ToolNimba Editorial Team · Updated 2026-06-23
PNG, JPEG, WebP and GIF work. Transparent PNGs keep their transparency. Your image never leaves your browser.
Fills the circle behind the image so transparent areas are not see-through. Uncheck to keep transparency.
Showing a placeholder token. Upload an image to make your own.
This token maker turns any picture into a clean round token for tabletop RPGs and virtual tabletops like Roll20, Foundry VTT and Owlbear Rodeo. Upload an image, watch it get cropped to a circle and wrapped in a colored ring, then tune the border color, border thickness and token size and download a ready to use PNG. Everything runs in your browser with the canvas, so your art is never uploaded to a server.
What is the Token Maker?
A virtual tabletop token is just a square PNG with a round subject. Most map tools snap pieces to a grid square, so a circular token reads clearly as a single creature and never overlaps its neighbors the way a raw rectangular screenshot would. This maker builds that shape for you: it draws your image onto a canvas, clips a circular path so only the disc is kept, scales the picture to cover the circle so there are no empty corners, then strokes a colored ring around the edge to frame it.
The ring border does real work at the table. A bright, consistent color makes a token pop against a busy battle map, and many groups use ring color as a code, for example green for allies, red for enemies and gold for the boss. The thickness slider lets you go from a thin hairline up to a chunky 30 pixel band, and the token size slider controls the exported resolution from 128 up to 512 pixels, which covers everything from a tight inline marker to a crisp large creature on a high resolution display.
The optional background color matters when your source art has transparency. A PNG cut out of a character sheet often has see through areas, and without a fill those areas would show the map underneath, which looks broken. Turn the background on to paint a solid disc behind the image first, or turn it off when you want the transparency preserved, for example a token meant to sit on a colored base in your VTT.
Because the whole pipeline is the FileReader and canvas APIs, nothing leaves your device. That keeps commissioned or paid art private, and it means the tool works offline once the page has loaded. The export is a lossless PNG, the format every major virtual tabletop accepts, so you can drag the file straight into your scene.
When to use it
- Making round player and monster tokens for Roll20, Foundry VTT or Owlbear Rodeo from any character art.
- Color coding tokens by ring, for example green for allies, red for enemies and gold for a boss.
- Turning a cropped portrait or AI generated image into a grid ready disc with one clean border.
- Building a consistent set of tokens at the same size and ring style for a whole encounter.
How to use the Token Maker
- Click Upload an image and pick the art you want to turn into a token (or skip this to style the placeholder first).
- Choose a ring color, then drag the thickness slider to set how bold the border looks.
- Set the token size slider for the export resolution, and toggle the background color if your image has transparency.
- Click Download PNG to save token.png, then drag it into your virtual tabletop scene.
Formula & method
Worked examples
You want a standard 256 pixel ally token with a 10 pixel green ring from a square portrait.
- Set token size to 256, so outer radius = 256 / 2 = 128
- Set border thickness to 10, so inner image radius = 128 - 10 = 118
- The image is scaled to cover a 236 pixel circle (118 x 2) and centered
- A 10 pixel green ring is stroked along radius 118 + 5 = 123, filling out to the 128 edge
Result: A 256 x 256 PNG with the portrait in a green ringed disc, ready to drop on the grid.
You have a transparent PNG of a dragon and want a bold 512 pixel boss token.
- Set token size to 512 and thickness to 24 for a chunky frame
- Turn the background color on and pick a dark slate so the transparent areas are not see through
- The dragon art is scaled to cover the inner 464 pixel circle and centered over the slate disc
- A 24 pixel gold ring is stroked at the edge to mark it as the boss
Result: A crisp 512 x 512 token with an opaque base and a thick gold ring.
Suggested token sizes for common uses
| Size (px) | Best for | Notes |
|---|---|---|
| 128 | Small inline markers | Light files, fine for low zoom maps |
| 256 | Standard creatures | The common default for most VTTs |
| 384 | Large creatures | Sharper on high resolution displays |
| 512 | Bosses and hero art | Maximum detail, larger file size |
A ring color code many tables use
| Ring color | Meaning | Example |
|---|---|---|
| Green | Allied or player character | The party members |
| Red | Hostile creature | Goblins, bandits |
| Gold | Boss or key NPC | The dragon, the villain |
| Blue | Neutral or summoned | A merchant, a familiar |
Common mistakes to avoid
- Leaving the background off for transparent art. If your PNG has see through areas and the background color is off, those areas will show the map underneath in your VTT, which looks broken. Turn the background on to paint a solid disc behind the image, or only leave it off when you genuinely want transparency.
- Cranking the border thickness too high. The ring eats into the image radius, so a very thick border on a small token leaves little room for the art. If the picture looks cramped, lower the thickness or raise the token size to give the image more space inside the ring.
- Exporting tiny tokens for a high resolution table. A 128 pixel token looks soft when zoomed in on a 4K display. Pick a larger size like 256 or 512 for crisp art, then let the virtual tabletop scale it down. It is easy to shrink a large token and impossible to add detail to a small one.
- Using a busy ring color that blends into the map. A muted or earthy ring can disappear against a dungeon or forest map. Choose a bright, saturated color that contrasts with your maps so the token edge stays easy to find in the heat of combat.
Glossary
- Token
- A small image, usually round, that represents a creature or character on a virtual tabletop map.
- VTT
- Virtual tabletop, software like Roll20, Foundry VTT or Owlbear Rodeo used to run RPGs online.
- Ring border
- The colored circle stroked around the edge of a token to frame it and code its role.
- Clip path
- A canvas circle that limits drawing so only the disc shaped area of the image is kept.
- Cover scaling
- Resizing an image so it fully fills a target area with no empty corners, cropping any overflow.
- PNG
- A lossless image format that supports transparency and is accepted by every major virtual tabletop.
Frequently asked questions
How do I make a round token for my virtual tabletop?
Upload your art, pick a ring color and thickness, set the token size, then click Download PNG. The tool crops the image to a circle and adds the colored ring automatically. Drag the saved token.png into your Roll20, Foundry or Owlbear Rodeo scene.
Is this token maker free and does it require sign up?
Yes, it is completely free with no account, no watermark and no limits. It runs entirely in your browser, so you can make as many tokens as you like without signing up for anything.
Are my images uploaded to a server?
No. The tool reads your file locally with the browser FileReader and canvas, so the art never leaves your device. That keeps commissioned or paid artwork private, and the tool keeps working offline once the page has loaded.
What image formats can I use?
Any format your browser can display works, including PNG, JPEG, WebP and GIF. Transparent PNGs are supported, and you can fill the background behind the transparency or keep it. The exported token is always a lossless PNG.
What size should my tokens be?
For most virtual tabletops 256 pixels is a good default. Use 128 for small inline markers, and 384 or 512 for large creatures or bosses on high resolution displays. Larger tokens look crisper when you zoom in but produce bigger files.
Why is the background showing through my transparent token?
Your image has transparent areas and the background color is turned off, so the map shows through. Turn the background color on to paint a solid disc behind the image, or leave it off only when you want the transparency preserved.