SVG у URI даних

SVG у URI даних. Виберіть локальний SVG чи вставте код, запустіть перегляд, масштабуйте й завантажте.

Підтримувані функції

Вхід: SVG · TXT
Вихід: SVG · TXT · CSS

Як використовувати SVG у URI даних

SVG у URI даних. Виберіть локальний SVG чи вставте код, запустіть перегляд, масштабуйте й завантажте.

Виберіть локальний SVG чи вставте код, запустіть перегляд, масштабуйте й завантажте.
Використовуйте статичний SVG без скриптів, зовнішніх ресурсів, вбудованих зображень, фільтрів чи анімації.
Скопіюйте результат чи завантажте на пристрій.

SVG у URI даних · Приклад

Вхід

<svg xmlns="http://www.w3.org/2000/svg" width="320" height="200" viewBox="0 0 320 200">
  <rect width="320" height="200" rx="24" fill="#eef1ff"/>
  <circle cx="100" cy="100" r="58" fill="#5265d8"/>
  <path d="M172 140 L222 54 L272 140 Z" fill="#e98367"/>
</svg>

Вихід

data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22320%22%20height%3D%22200%22%20viewBox%3D%220%200%20320%20200%22%3E%0A%20%20%3Crect%20width%3D%22320%22%20height%3D%22200%22%20rx%3D%2224%22%20fill%3D%22%23eef1ff%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%22100%22%20cy%3D%22100%22%20r%3D%2258%22%20fill%3D%22%235265d8%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M172%20140%20L222%2054%20L272%20140%20Z%22%20fill%3D%22%23e98367%22%2F%3E%0A%3C%2Fsvg%3E

Примітки щодо використання

Файли й дані обробляються в цьому браузері. Без надсилання на сервер і облікового запису.

Обмежений SVG: фігури, текст і градієнти. Шаблони, маски та маркери не підтримуються.

SVG відображається як зображення. Код не вставляється в документ застосунку.

Використовуйте статичний SVG без скриптів, зовнішніх ресурсів, вбудованих зображень, фільтрів чи анімації.