πŸ› οΈToolsShed

SVG to CSS Converter

Convert SVG code to CSS background-image data URI. Supports URL-encoded and Base64 formats.

Frequently Asked Questions

Code Implementation

import base64
from urllib.parse import quote

def svg_to_css_url_encoded(svg: str) -> str:
    encoded = quote(svg, safe="")
    return f'background-image: url("data:image/svg+xml,{encoded}");'

def svg_to_css_base64(svg: str) -> str:
    b64 = base64.b64encode(svg.encode("utf-8")).decode("ascii")
    return f'background-image: url("data:image/svg+xml;base64,{b64}");'

svg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#6366f1"/></svg>'

print("URL encoded:")
print(svg_to_css_url_encoded(svg))
print()
print("Base64:")
print(svg_to_css_base64(svg))

Comments & Feedback

Comments are powered by Giscus. Sign in with GitHub to leave a comment.