SVG Viewer & Editor Online

View, edit, and export SVG files instantly in your browser — no upload, no install, fully private.

Try it Free →

Features

✏️

Live Code Editing

Edit SVG source code directly with 300ms debounced live preview update.

🖼

Export SVG & PNG

Download the edited SVG file or export as PNG at 1×, 2×, or 4× resolution.

🎨

Background Toggle

Switch between white, checkerboard (transparent), and black backgrounds for accurate preview.

🔒

XSS-Safe Rendering

SVG is sanitized with DOMPurify before rendering — safe from malicious scripts.

⚙️

Attribute Panel

Edit width, height, viewBox, fill, and stroke on the SVG root element directly.

📊

SVG Metadata

Instantly see file size, total element count, and whether the SVG contains animations.

How to Use

1

Load your SVG

Click 'Open File' to upload an SVG, drag and drop a file, paste SVG code directly, or click 'Example' to try a built-in sample.

2

Edit and preview

Modify the SVG source code in the left panel. The right panel updates in real time (300ms debounce). Use the attribute panel to quickly edit root SVG properties.

3

Export or copy

Click '↓ SVG' to download the edited file, '🖼 PNG' to export as a raster image, or '📋 Copy Code' to copy the SVG source to clipboard.

Frequently Asked Questions

Is this SVG editor free?
Yes, completely free with no sign-up required. All processing happens in your browser.
Is my SVG file uploaded to a server?
No. Your file never leaves your device. Everything runs locally in the browser.
Is it safe to render SVG from unknown sources?
Yes. All SVG content is sanitized with DOMPurify before rendering, removing any scripts or dangerous attributes.
Can I export an SVG as PNG?
Yes. Choose 1×, 2×, or 4× resolution and click the PNG button. The SVG is drawn onto a Canvas and exported as a PNG image.
What does the checkerboard background mean?
The checkerboard pattern shows transparent areas in the SVG, helping you verify which parts have no fill or are semi-transparent.

← Back to pudone! home