Why do parts of my SVG fill in as solid blobs?

A path can contain several closed contours. The letter O is one outer contour and one inner one. The renderer has to decide whether a point between them is inside or outside the shape, and there are two ways to decide.

With evenodd, a point is inside when a ray from it crosses an odd number of contours, so the inner ring comes out empty. With the default nonzero rule, the answer depends on the direction each contour was drawn, and for artwork whose contours all run the same way, the hole fills in.

The outline stays perfect and the insides go solid. Letters with counters turn into slabs, rings turn into discs, and a logo with a star inside a circle becomes a circle. It reads as if the file were corrupted, and the file is fine.

The Dragon Ball Z wordmark is a good test case: its whole construction depends on evenodd, and dropping the attribute turns it into a row of black shapes.

Usually in conversion. A tool that rebuilds paths, flattens groups, or copies the d attribute onto a new element without copying the presentation attributes alongside it will lose fill-rule silently. Nothing errors, because a missing fill-rule is legal and simply means nonzero.

It can also arrive as CSS rather than an attribute, in which case it is lost by anything that strips the stylesheet, which is the same failure described in the note on colours.

Open the SVG in a text editor and search for fill-rule. If you find evenodd, the holes in your artwork depend on it and any tool you pass it through has to preserve it. If you find clip-rule too, it is doing the same job for clipping paths.

<g fill-rule="evenodd" clip-rule="evenodd">
  <path d="…"/>
</g>

Note that it is often set once on a parent group, not on each path. A converter that reads only the path element sees nothing to preserve.