Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
# Encodes SVG to suitable string for CSS inlining
# Usage in terminal: sed -f svg-encode-inline.sed your-minified-with-svgomg-icon.svg > your-encoded-icon.svg
# Then paste result in your CSS as `background-image: url("data:image/svg+xml,PASTE");`
#
# Equivalent to
# .replace(/"/g, '\'')
# .replace(/%/g, '%25')
# .replace(/#/g, '%23') <-- hex colors
# .replace(/{/g, '%7B')
# .replace(/}/g, '%7D')
# .replace(/</g, '%3C')
# .replace(/>/g, '%3E')
s/\"/\'/g
s/%/%25/g # substitute before others!
s/#/%23/g
s/{/%7B/g
s/}/%7D/g
s/</%3C/g
s/>/%3E/g
@PhilippeVay

This comment has been minimized.

Copy link
Owner Author

commented Sep 4, 2019

CSS

background-image: url("data:image/svg+xml,PASTE");
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.