Icons → Code

Export Icons as vector-perfect code components for Android, React, ReactNative, Angular, Vue, TTF, EPS, PDF, Custom components and more.

v0.0.1 is compatible with Sketch 3.0.0

Figma Banner

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


Join the discussion

Download v0.0.1
Usage Activity
400100

No Sketchpacks Relay integration found

Stats
  • 15 downloads all–time
  • 4 downloads this week
  • 15 downloads this month
About this plugin

Sugarcode-Team published this plugin 21d ago.

v0.0.1 is the latest version.

Native updates are supported within Sketch.app.