You can use the <img>
or <object>
elements to embed external SVG elements. Setting the height and width is optional but is highly recommended.
<img src="attention.svg" width="50" height="50">
Using <img>
does not allow you to style the SVG using CSS or manipulate it using JavaScript.
<object type="image/svg+xml" data="attention.svg" width="50" height="50">
Unlike <img>
, <object>
directly imports the SVG into the document and therefore it can be manipulated using Javascript and CSS.