Try svgin
svgin fetches an SVG from a URL (or takes raw markup directly) and renders it as a real, styleable element instead of an <img>. It sanitizes the SVG by default, so it is safe to use with an SVG you did not create yourself.
This site is installed as a real dependency from npm, not imported from either library's source, so every demo below reflects exactly what a real install gives you.
Pick a package
@svgin/react
Client and server React components
<SvgIn />, <SvgInSuspense />, <SvgInProvider>, and <SvgInShadow /> - sanitize-by-default SVG loading for React.
Try it →
@svgin/element
A framework-agnostic custom element
<svg-in>, a real vanilla Custom Element - works in any framework, or none, no React required.
Try it →