SVG — векторный формат: картинка хранится как набор фигур и линий, а не как сетка пикселей. Поэтому её можно увеличивать без потери качества — идеально для логотипов, иконок и иллюстраций. Нарисовать SVG можно в браузере в нашем SVG-редакторе.
Чем SVG отличается от PNG и JPG
- SVG — векторный. Не теряет чёткость при любом масштабе, файл обычно очень лёгкий, фон прозрачный по умолчанию. Подходит для логотипов, иконок, схем и иллюстраций. Не подходит для фотографий.
- PNG — растровый, без потерь, с прозрачностью. Подходит для картинок с чёткими краями. При сильном увеличении виден «пиксель».
- JPG — растровый, для фото. Прозрачности нет.
Подробнее про форматы с прозрачностью — в статье прозрачный фон у картинки.
Как нарисовать SVG в редакторе
- Откройте SVG-редактор. Размер холста задайте справа в блоке «Холст».
- Выберите инструмент: «Прямоугольник», «Эллипс», «Линия», «Карандаш» (рисование от руки), «Текст» или «Картинка».
- Нарисуйте фигуру на холсте — потяните мышью или пальцем. Одиночный клик создаёт фигуру стандартного размера.
- Вернитесь к инструменту «Выбор» и настройте фигуру: заливка, обводка, толщина, прозрачность, скругление углов у прямоугольника.
- Меняйте размер за маркеры по краям рамки, поворачивайте за круглую ручку сверху.
- Расставьте слои кнопками «На передний план», «Выше», «Ниже», «На задний план».
- Сохраните: «Скачать SVG» или «Скачать PNG» (с множителем 1–4×).
Полезные приёмы
- Клавиша Shift при рисовании делает фигуру пропорциональной: квадрат или круг.
- Стрелки сдвигают выбранный объект на 1 пиксель, со Shift — на 10.
- Ctrl+D — копия объекта, Delete — удалить, Ctrl+Z — отмена.
- Фон холста можно отключить — получится прозрачный файл для логотипа.
Что можно сделать в SVG
- Простой логотип из фигур и текста.
- Иконку, схему, блок-схему, стрелки.
- Элементы оформления для сайта или презентации.
- Рамку, значок, наклейку, которую позже можно вставить в коллаж как PNG.
Ограничения
Это простой редактор: в нём нет кривых Безье и сложных операций с контурами, как в профессиональных программах. Шрифты текста — стандартные системные, их оформление сохраняется при экспорте в PNG; в SVG текст остаётся текстом, который отображается шрифтом, установленным на компьютере зрителя. Для сложных иллюстраций лучше подойдёт настольный векторный редактор.
Работа идёт в браузере, файлы нигде не сохраняются автоматически — скачайте результат до закрытия страницы.