SVGO: Killing #000000 fill

Question

I'm using svgo and am running into an odd issue where it's killing my fill color, but only if it's #000000 ; or any variation of the sort, black , #000 . I've tried setting removeUselessStrokeAndFill to false but it continues to remove that color only. Editing the src .svg file with something different maintains the fill color. Is there a setting I'm missing? Thanks!

Answer 1

No, you're doing it right. There is actually an issue #115 on the svgo about this.

To fix this, you have to set your color to another black, the closer to the real black is #000001 . So you can change all your black color references to this in your svg , wait for a fix, or event better, install gulp-replace and do something like this :

gulp.task('blackify', function () {
  return gulp.src('*.svg')
    .pipe(replace('#000000', '#000001'))
    .pipe(gulp.dest('./'));
});

Answer 2

To clarify, this is actually right behaviour of SVGO, because the default fill and stroke colour of an SVG is black and thus useless if it's redeclared as the fill. That's the reason it's removed from the output. Any other fill which is not the default, will be left alone as intended.

See: http://www.w3.org/TR/SVG/painting.html#FillProperties