SVG to Code — free online converter
You have a nice little SVG icon and you want to drop it straight into your code, but pasting raw SVG never quite works the way you need. Sometimes you want it as a CSS background, sometimes as a tidy data-URI, sometimes as a React component. We added a free tool that handles all of it — SVG to Code — right in your browser.
What it does
Paste your SVG and it converts it for you. You can get a CSS background data-URI (URL-encoded), a base64 data-URI, or a React component. Pick the format you need and the output is ready to copy into your project.
Nothing leaves your device
The whole thing runs in your browser. Your SVG is never uploaded to a server and nothing is saved anywhere. When you close the tab, it's gone. So even private or work icons stay with you.
How to use it
- Open SVG to Code and paste your SVG into the box.
- Choose the format you want: CSS data-URI, base64, or a React component.
- Copy the result and paste it into your code.
It's free with no limit. There are more small tools on the Apps page.