Optimize.svg

About this plugin

Copy your layers/frames into optimized svg code. Toggle on/off settings to dial in your optimization depending on your use case.

While in Dev Mode and the Inspect Panel is active: Select your frame/layer to generate optimized svg code for you to copy and paste inline within your code.

Optimize.svg leverages the power of svgo.js and its extensive plugin options. We have enabled a few by default to help optimize your code out of the box along with providing toggle options for others.

Dev Settings that can be toggled on/off:

• Width of Viewbox
• Use Layer Names - Use your layers/frames names as IDs or Classes by toggling this option
• Remove Doctype
• Remove XMLNS
• Merge Paths
• Inline Styles
• Merge Style
• Minify Styles
• Convert Ellipse to Circle
• Convert Shape to Path

Set by Default

cleanupAttrs
cleanupEnableBackground
cleanupNumericValues
collapseGroups
convertColors
convertPathData
convertTransform
moveElemsAttrsToGroup
moveGroupAttrsToElems
removeComments
removeDesc
removeEmptyAttrs
removeEmptyContainers
removeEmptyText
removeHiddenElems
removeMetadata
removeNonInheritableGroupAttrs
removeTitle
removeUnknownsAndDefaults
removeUnusedNS
removeUselessDefs
removeUselessStrokeAndFill
removeXMLProcInst
sortAttrs
sortDefsChildren