Копирование SVG | Web Мастерская

При правках иконок на SVG, может появиться необходимость скопировать полностью или какую то часть иконки. Чтобы не плодить один и тот же код несколько раз, его можно выводить в нужном месте, при помощи тега <use>.

Так как все иконки находятся у меня в отдельном файле, в этом же файле я написал макет, который используется во многих SVG картинках:

	<defs>
		<g id="model">
			<!-- Код макета -->
		</g>
	</defs>

Теперь там, где мне нужен макет, получаю его в иконку так:

<use xlink:href="#model"/>

Важно: Если Вы как и я храните иконки в отдельном файле, и в этом файле используете тег <use>, в открывающемся теге <svg> должна присутствовать строка: xmlns:xlink="http://www.w3.org/1999/xlink":

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">

Чтобы не повторять мои ошибки: Тема: Ошибки в коде SVG.

Возможно, будет интересно:
- Тема: Масштабируемая векторная графика (SVG: Scalable Vector Graphics)
- Блог: Как выводить SVG иконки из отдельного файла (Подключение файла SVG)
- Тема: Ошибки в коде SVG