How do I exclude SVG paths?

Paste two overlapping paths and click Exclude. Each path gets a luminance mask: itself in white, the other in black. The overlap is empty; each path keeps the area the other does not cover.

How is exclude different from subtract?

Subtract is minus-front: only the first path remains, with the second cut out of it. Exclude is XOR: both paths remain as complementary crescents. Intersect keeps only the overlap.

Is exclude the same as Create Compound Path?

No. Compound concatenates d into one evenodd path (typical for a letter with a hole). Exclude keeps two elements, two fills, and two masks — useful when each leftover should keep its own color.

Does unite also drop the overlap?

Opposite. Unite joins with fill-rule nonzero so the overlap stays filled as one silhouette. Exclude removes that overlap on purpose.

Exclude SVG Paths — Free Tool

FAQ

Quick answers

How do I exclude SVG paths?: Paste two overlapping paths and click Exclude. Each path gets a luminance mask: itself in white, the other in black. The overlap is empty; each path keeps the area the other does not cover.
How is exclude different from subtract?: Subtract is minus-front: only the first path remains, with the second cut out of it. Exclude is XOR: both paths remain as complementary crescents. Intersect keeps only the overlap.
Is exclude the same as Create Compound Path?: No. Compound concatenates d into one evenodd path (typical for a letter with a hole). Exclude keeps two elements, two fills, and two masks — useful when each leftover should keep its own color.
Does unite also drop the overlap?: Opposite. Unite joins with fill-rule nonzero so the overlap stays filled as one silhouette. Exclude removes that overlap on purpose.

Subtract paths → Unite paths → Intersect paths → Create compound path →

Privacy Terms

Source

Ready

React component

React Native (react-native-svg)

PNG export · 2× for retina

0 B

Exclude SVG Paths

Live preview