Add Badge Overlays to a Whole SVG Icon Set

A document icon with a plus badge, the same icon with a star, a lock, a warning sign. Toolbars are full of these, and until now they were hand work: open the base, paste the badge, nudge it into the corner, save under a new name, next. IconVectors 2.1+ turns the whole thing into one batch. You select the base icons in the Icon Explorer, add the badge files, set a position and a size, and Add Badge Overlays writes a new file for every combination.

This guide is for IconVectors 2.1+ (Windows now, macOS and Linux as soon as 2.10 ships there). It takes about ten minutes the first time and a minute every time after, because the dialog remembers your overlay list and settings.

1. Select the base icons in the Icon Explorer

Press F5 to open the Explorer, go to the folder (Ctrl+Shift+O or the address field), and select the icons that will receive a badge. Ctrl+A takes everything in the grid; the Filter box narrows a big folder to a name fragment first. Only saved SVG files qualify, so if one of them is open in the Editor with unsaved changes, save or close it.

The selection is the list of bases. The badges come from the dialog, not from the selection, so you do not need to put them in the same folder.

2. Open Add Badge Overlays and add the badge files

Choose Explorer -> Batch Processing -> Add Badge Overlays..., or right-click the selection, or use the Batch Processing toolbar menu. Click Add overlays... and pick the badge SVGs. Each one appears in the list with its own filename suffix, which starts as a hyphen plus the badge's name: document.svg plus add.svg gives document-add.svg. Select an entry to change its suffix, or Remove overlay to drop it from this batch (the file itself stays where it is).

Every base is combined with every badge, one badge per result. Three bases and two badges make six files; forty bases and six badges make 240. The dialog does not stack all badges onto one icon, and it refuses a plan above 10,000 combinations instead of quietly dropping some.

3. Set position, size, margin and cutout

• Position: one of nine, bottom-right at first. Centered axes stay centered.
• Overlay size: a percentage of the base canvas's shorter side, 40% at first and never more than 100%. The badge's painted bounds, strokes included, are fitted inside that square without changing its aspect ratio. This is geometry, not an optical fit, so a badge with lots of empty space around its drawing will look small; crop it in the Editor first.
• Edge margin: distance from the edge in base SVG units. On a 24 by 24 icon one unit is one pixel at 1x. A margin and size that cannot both fit are rejected rather than clipped.
• Make badge cutout: removes the base artwork behind the badge with a clearance, one unit at first. It is a real geometric cutout. Leave it off and the badge simply sits on top, which is right for badges with their own opaque background.

Then choose the output folder and check Replace existing files only if you mean to overwrite an earlier run. Nothing can overwrite a base, a badge or the document open in the Editor, whatever you tick.

4. Preview every pair

Click Preview Changes. The confirmation dialog counts bases, overlays, outputs, hidden selections and replacements, lists every destination, and lets you select a pair to see its before and after image. Look at a few pairs, including one with the smallest base and one with the busiest badge. If a corner needs a bigger margin, press Back: it returns to the options with your overlay list intact, you change the number, and preview again.

Unsupported content is reported per input rather than approximated: text, images, masks, clip paths, filters, use instances and stylesheet blocks are refused, and with cutout on, a gradient-painted stroke is refused too. A base with a duplicate ID is repaired in a private copy when nothing refers to that ID, and the preview says so with the old and new names.

5. Write the files and check them

Click Add Badge Overlays. The complete set is staged first and then committed, so a failure halfway rolls the set back and tells you about any recovery file it had to keep. There is no Editor Undo for this, which matters less than usual because the originals are never written: to redo a batch, delete the outputs and run it again.

Explorer refreshes when it finishes. Double-click one output to open it in the Editor and check the corner at 100%, then press F5 to come back. If a badge looks off, you can also open the output and move it; it is a normal group above the base artwork, with its IDs kept separate from the base's.

Tips from the first few runs

• Keep a folder of badges at the same canvas size as your icon set. The size percentage is relative to the base, so one folder of 24-unit badges works for a 24-unit set and a 48-unit set alike.
• A badge that already has a circular background does not need cutout. A bare glyph badge usually does.
• The overlay list and every option are saved as soon as they are valid, even if you cancel, so the second run is open, select, preview, apply.
• From an MCP client, explorer_batch_overlay_icons runs the same plan and apply steps on explicit paths or the Explorer selection. See Drive Icon Explorer and Batches from MCP.

Try it on a copy of a small folder first: download the IconVectors 2.10 trial for Windows, pick three icons and one badge, and look at the preview before you write anything.