Icons → Code by icanicon.io

The Design System Middleware that allows you to manage, import, convert and sync graphical assets or icons directly from Sketch into your application code.

Export options

• React (.js)
• Vue (.js)
• Angular (.js)
• Meteor (.html)
• ReactNative (.js)
• Ionic (.js)
• Android (.xml)
• iOS (.pdf)
• Icon Font (.ttf)
• Vector Graphic (.svg) (minified)
• CSS Sprite (.svg)
• ICO (.ico)
• EPS (.eps)
• Portable Document (.pdf)

Installation

• Download the latest release of the plugin
• Un-zip
• Double-click on icontocode.sketchplugin

How to use the plugin

• Simply run the plugin and select all icons you would like to export. You can then choose an export option and generate your files.\

Build and export custom components (with subscription)

Upload custom code and set a file type of choice to then be able to export icons based on your template.

icanicon.io subscription info

• Export up to 50 icons for free - no subscription required
• Get a 30 day trial period with unlimited exports and full feature set here
• Get more information about icanicon.io here

Good to know

• Avoid including mockups, more complex components, or other elements that are not meant to be icons in your export file.
• Choose your file naming-convention wisely as these names might carry over to your codebase.

Thanks, and enjoy it! Your Sugarcode Team