Importing SVG files into a project
Last updated
Was this helpful?
Last updated
Was this helpful?
Manually remove clipPaths from the file. This includes <g>
, <clipPath>
, and <def>
tags, plus any additional child elements wrapped in <def>
tags. Here’s a visual example where the tags to remove are commented out:
Copy the viewBox
attribute and its values.
Minimize the contents of the file with the in VSCode.
Paste the viewBox
attribute back into the file after the height
attribute.
If the SVG is missing the viewbox
attribute and its values, the SVG will be broken and the front-end Dude on the project will wonder why their pretty SVG styles aren’t showing up in the browser.