SVGR

React supports SVG out of the box, it's simpler, easier and much more powerful to have components instead of SVG files. Wrapped in a React component, your SVG is inlined in the page and you can style it using CSS. SVGR differs from other library by its solid architecture. It uses svg-parser + Babel to transform SVG code into JavaScript code. A whole directory can be processed, all SVG files (matching .svg or .SVG) are transformed into React components. It is possible to target React Native using react-native-svg. SVGR exposes a Node API, you can create a custom script or build another tool based on SVGR. SVGR can be used as a webpack loader, this way you can import your SVG directly as a React Component. SVGR ships with a handful of customizable options, usable in both the CLI and API. Modify all SVG nodes with uppercase and use a specific template with react-native-svg imports. All unsupported nodes will be removed.