SVG Clip Baker

SVG Clip Baker is a Node.js script that "bakes" (flatten) SVG clip-paths into real geometry. I made it because Blender does not support clip-paths exported from Affinity Designer 2 on iPad, and I needed a way to import my vector drawings without losing their visual shape.

Goal

• Remove clip-path dependencies.
• Flatten groups and keep only real geometry.
• Preserve paint order (z-order) and styles.
• Handle nested clips (multi-level).

⚠️ Disclaimer: This is tested only for my workflow (Affinity Designer 2 → Blender). I don’t know how it behaves with other SVG sources or more complex cases.

Usage

node svg-clip-baker.js input.svg --out output.svg [options]

Example:

node svg-clip-baker.js clip-test-04.svg --out clip-test-04-baked.svg --verbose

Options

• --out file.svg → output file (default: input name with .baked.svg).
• --apply-transforms (true/false) → apply transforms when flattening.
• --expand-stroke (true/false) → expand strokes to fills before baking.
• --simplify=N → geometry simplification (0 = disabled).
• --verbose → detailed logging.

Examples

In the examples/ folder you can find test cases such as:

• clip-test-04.svg → clip-test-04-baked.svg

Credits

• Written by ChatGPT 5.
• Uses paper.js, jsdom, and node-canvas.

License

MIT (do whatever you want, no warranties).