How to Work with SVGs in Figma, HTML, and CSS | Optimized SVG Icons

by | May 22, 2021 | 0 comments

How to Work with SVGs in Figma, HTML, and CSS | Optimized SVG Icons

by | May 22, 2021 | CSS Tips and Tricks | 0 comments



Learn how to work with SVGs to prepare SVG files for export in Figma, optimize them using SVGOMG, and inline them in HTML with dedicated CSS styles.

Other Build UX How-Tos:

View the Figma file for this how-to:
https://www.figma.com/file/bHUY7IeKeWrOvpDxy4nAHaUL/How-to-Work-with-SVGs

Get the starter files for this how-to:
https://github.com/build-ux/how-to-work-with-svgs

SVG optimization tool (SVGOMG):
https://jakearchibald.github.io/svgomg/

Build UX Twitter:

Build UX Instagram:
https://www.instagram.com/build_ux

Build UX website (coming soon):
https://buildux.co

Music:
Self produced, 2012

source