Subtract one circle from another in SVG

Question

I\'m trying to find a way to subtract one shape from another in SVG, creating a hole in the middle or a bite out of the side of it. Kind of like a clipping path, but instead of

Answer 1

A mask is what you want. To create a , make things you want to keep white. The things you want to be invisible make black. Colours in between will result in translucency.

So the resulting SVG is similar to your pseudo-markup and looks like this:

We are filling the mask with a white rectangle, and then we put a black circle where we want the hole to be.