Plugins
removeAttributesBySelector

removeAttributesBySelector

Since v1.2.0Source

Removes specific attributes from elements that match a CSS selector.

Usage

Basic
Parameters

svgo.config.js
module.exports = {
  plugins: [
    "removeAttributesBySelector"
  ]
}

svgo.config.js
module.exports = {
  plugins: [
    {
      name: "removeAttributesBySelector",
      params: {
        selector: "[fill='#00ff00']",
        attributes: "fill",
        selectors: null
      }
    }
  ]
}

Parameters

selector: A CSS selector that matches the elements to be modified.
attributes: An attribute, or array of attributes, to remove from the matched elements.
selectors: An array of objects, each containing selector and attributes as described above. To match on more than one selector, use this parameter instead of the two above.

Demo

Live Editor

Reset

const svg = `
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox=" 0 0  150 100 " width="150">
  <!-- Created with love! -->
  <defs>
    <ellipse cx="50" cy="50.0" rx="50.00" ry="auto" fill="black" id="circle"/>
  </defs>
  <g>
    <use href="#circle" transform="skewX(16)"/>
    <rect id="useless" width="0" height="0" fill="#ff0000"/>
  </g>
</svg>
`;

const svgoConfig = {
  js2svg: { indent: 2, pretty: true },
  plugins: [
    "removeAttributesBySelector"
  ]
}

render(<SvgoPreview svg={svg} svgoConfig={svgoConfig}/>);

Result

prefixIds

removeAttrs

On this page

Usage
- Parameters
Demo

Edit this page on GitHub

Community

Copyright 2026 SVGO and Contributors
Source Code under MIT Content and Assets under CC-BY-4.0
Designed and Illustrated by Vukory