Optimize SVG files with SVGO on the command line

November 2022Jonathan Gruber

The SVG code most programs like Adobe Illustrator generate is far from ideal. Often the code can be simplified significantly, e. g. by removing unnecessary attributes to minimize the file size.

I used to visit the SVGOMG website, a frontend of the SVGO utility, to perform these optimizations. But for lots of SVG files, this becomes cumbersome. SVGO can be called on the command line to process whole directories, though:

svgo *.svg

Configuration

You probably want to create a configuration file to tweak the default settings. I am currently using this one:

// ~/.svgo-config.js (for example)
module.exports = {
  plugins: [
    'preset-default',
    {
      name: 'cleanupIds',
      params: {
        force: true,
      },
    },
    {
      name: 'removeAttrs',
      params: {
        attrs: 'data.*',
      },
    },
  ],
};

Now you can optimize SVG files using the added configuration file:

svgo --config ~/.svgo-config.js *.svg