SVG Optimizer, Sanitizer and SVG to PNG Converter Online
Optimize SVG with svgo, strip scripts and external references from untrusted SVG, inspect it, or render it to PNG / JPEG at any size, without a browser.
Result
Press “Run” to see the result.
Four actions on one SVG (sent as svg, an uploaded file, a raw image/svg+xml body or a url). optimize (default) runs svgo with its default preset but keeps ids and role attributes, so CSS, scripts and #anchors that point into the file keep working; precision, multipass, pretty and aggressive=true (pure preset + removeDimensions) are available, and sanitize=true cleans the file first. sanitize removes everything that can run code or leak data: <script>, on… event handlers, javascript: / data: links that are not raster images, <foreignObject>, <iframe> / <embed>, external images and stylesheets (@import, url(https://…)) unless allow_external=true, and animations that rewrite links. The response lists every removed item. info reports size, viewBox, element counts, scripts and external references.
render turns the SVG into PNG (default) or JPEG with our own renderer written in JavaScript (no headless browser, no resvg): paths with every command including arcs, basic shapes, groups and transforms, nested svg, use / symbol, fills (non-zero / even-odd) and strokes (caps, joins, miter limit, dashes), opacity, linear and radial gradients, clip-path, luminance masks, simple <style> rules (tag, .class, #id), embedded PNG / JPEG images and text drawn from embedded fonts (Be Vietnam Pro for sans-serif, JetBrains Mono for monospace, STIX Two Math for serif), so Vietnamese text renders correctly. Set width and / or height (up to 4096 px, 5 megapixels) or scale, and background.
Not drawn: filters (blur, drop shadow), patterns, markers, textPath, external images and web fonts; they are listed in the x-render-warnings header (or warnings with format=json). On our test set the output matches Chrome to within anti-aliasing. Files are processed in memory and never stored.
Use this in your code
curl -X POST "https://apibox.io.vn/v1/svg-tools" \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"120\" height=\"120\" viewBox=\"0 0 120 120\"><!-- Logo --><metadata>Created by Editor 1.0</metadata><g id=\"logo\"><rect x=\"10.000\" y=\"10.000\" width=\"100.000\" height=\"100.000\" rx=\"20\" fill=\"#0F766E\"/><circle cx=\"60\" cy=\"60\" r=\"30.0000\" fill=\"#ffffff\" fill-opacity=\"1\"/></g></svg>"}'const res = await fetch('https://apibox.io.vn/v1/svg-tools', {
method: 'POST',
headers: {
Authorization: 'Bearer YOUR_API_KEY',
'Content-Type': 'application/json',
},
body: JSON.stringify({
"svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"120\" height=\"120\" viewBox=\"0 0 120 120\"><!-- Logo --><metadata>Created by Editor 1.0</metadata><g id=\"logo\"><rect x=\"10.000\" y=\"10.000\" width=\"100.000\" height=\"100.000\" rx=\"20\" fill=\"#0F766E\"/><circle cx=\"60\" cy=\"60\" r=\"30.0000\" fill=\"#ffffff\" fill-opacity=\"1\"/></g></svg>"
}),
});
const data = await res.json();
console.log(data);import requests
res = requests.post(
"https://apibox.io.vn/v1/svg-tools",
headers={"Authorization": "Bearer YOUR_API_KEY"},
json={"svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"120\" height=\"120\" viewBox=\"0 0 120 120\"><!-- Logo --><metadata>Created by Editor 1.0</metadata><g id=\"logo\"><rect x=\"10.000\" y=\"10.000\" width=\"100.000\" height=\"100.000\" rx=\"20\" fill=\"#0F766E\"/><circle cx=\"60\" cy=\"60\" r=\"30.0000\" fill=\"#ffffff\" fill-opacity=\"1\"/></g></svg>"},
timeout=30,
)
print(res.json())<?php
$ch = curl_init('https://apibox.io.vn/v1/svg-tools');
curl_setopt_array($ch, [
CURLOPT_RETURNTRANSFER => true,
CURLOPT_CUSTOMREQUEST => 'POST',
CURLOPT_HTTPHEADER => ['Authorization: Bearer YOUR_API_KEY', 'Content-Type: application/json'],
CURLOPT_POSTFIELDS => '{"svg":"<svg xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" width=\\"120\\" height=\\"120\\" viewBox=\\"0 0 120 120\\"><!-- Logo --><metadata>Created by Editor 1.0</metadata><g id=\\"logo\\"><rect x=\\"10.000\\" y=\\"10.000\\" width=\\"100.000\\" height=\\"100.000\\" rx=\\"20\\" fill=\\"#0F766E\\"/><circle cx=\\"60\\" cy=\\"60\\" r=\\"30.0000\\" fill=\\"#ffffff\\" fill-opacity=\\"1\\"/></g></svg>"}',
]);
$response = curl_exec($ch);
print_r(json_decode($response, true));API documentation → Get a free API key
FAQ
Is the optimised SVG safe to change visually?
The default preset is lossless for rendering; numbers are rounded to precision (3) decimals. Ids are kept so external CSS / JS keep working; use aggressive=true to drop them and the width / height.
Does sanitising make any SVG safe to inline in HTML?
It removes scripts, event handlers, script URLs, foreign HTML, external loads and link-changing animations, which covers the known SVG XSS vectors. Still serve user files with a strict Content-Security-Policy.
Why does my PNG look different from the browser?
Filters, patterns, markers and web fonts are not supported; the header x-render-warnings lists what was skipped. Text uses the embedded fonts, so letter shapes can differ from the font you designed with.