SVG-файлы в Google Web Designer

SVG – это основанный на XML графический формат, который используется в векторной графике. SVG-изображения могут быть особенно полезны для использования в адаптивных макетах, поскольку их размер можно менять без снижения качества.

Изменение размера элементов SVG

Чтобы увеличить изображение или фигуру SVG, используйте свойства ширины и высоты, а не 3D-масштабирование. Для управления трансформацией с помощью инструмента выделения необходимо изменить стиль размера.

Как добавить SVG-файл

Файлы в формате SVG можно добавлять несколькими способами:

• Импортировать SVG-файл (подробную информацию можно посмотреть ниже).
• Использовать инструменты для создания фигур и инструмент "Перо".
• Вставить SVG-код в режиме просмотра кода.
• Добавить SVG-код в режиме просмотра макета.
• Преобразовать текстовый элемент в формат SVG, применив фильтр SVG.

Как импортировать SVG-файлы

Чтобы импортировать SVG-файл, в меню Файл выберите Импортировать объекты или перетащите файл в рабочую область документа Google Web Designer.

Импортируя SVG-файл, вы можете добавить его как изображение или встроить код SVG в HTML-код документа. В таблице ниже перечислены примеры использования для каждого способа.

Изображение	Встроенный код
Его можно применить в качестве маски изображения. Для него доступна настройка точки фокуса. Из него можно извлекать цвета. Его можно импортировать на панель "Библиотека".	В него можно добавлять фильтры SVG. Для него доступно редактирование в режиме просмотра кода.

Как использовать фильтры SVG

С помощью фильтров SVG вы можете добавлять различные эффекты, например размытие, сияние и другие. Полный список фильтров SVG можно посмотреть здесь.

    

Примеры фильтров SVG (слева изображен SVG без фильтра)