- Include a descriptive `<title>` element for accessibility. The `<title>` must have an ID of the format `simpleicon-<iconname>-title` - for example, `<title id="simpleicon-github-title">GitHub icon</title>`.
- Add `aria-labelledby="simpleicon-<iconname>-title"` and `role="img"` to the `<svg>` element to improve screen reader support.
- Use a `viewBox` of 24 by 24, following [Google’s Material Design guidelines for system icons](https://material.io/guidelines/style/icons.html#icons-system-icons).
- Ensure that all paths and strokes have been converted to fills.
- Ensure your SVG is monochromatic. Remove all fill colors so that icons default to black.
- Minify your SVG after exporting it. We recommend using [SVGO](https://github.com/svg/svgo) or [SVGOMG](https://jakearchibald.github.io/svgomg/) to automate this process.
## JSON data for simpleicons.org
In addition to following the guidelines for SVGs, list new icons in the `_data/simple-icons.json` file. Each icon in the array has three required values:
While the parent `<svg>` element can sometimes contain other attributes, the attributes listed above are the only necessary ones. You can remove safely remove attributes like `width` and `height`, or clean them using a tool like [SVGO](https://github.com/svg/svgo) or [SVGOMG](https://jakearchibald.github.io/svgomg/).
Here is the un-minified contents of the GitHub icon, for reference: