Remove Title

Default

Removes the <title> element from the document.

This plugin may have significant accessibility implications. The purpose of <title> is to provide users of assistive technologies the means to get a summary of the SVG if they're not able to view it.

It can be sensible to remove the <title> element in one of the following scenarios:

• The SVG is purely aesthetic and has no impact on the user-experience.
• Accessibility is handled elsewhere, such as in the aria-label or aria-describedby attributes in an HTML document.

Consider doing the free Introduction to Web Accessibility course by W3Cx for more information.

Usage

svgo.config.js

module.exports = {
  plugins: [
    "removeTitle"
  ]
}

Demo

Live Editor

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: [
    "removeTitle"
  ]
}

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

Result

Loading...

Implementation

• https://github.com/svg/svgo/blob/main/plugins/removeTitle.js