Colors → Code

Export Colors as organized Stylesheets for Android, CSS, Less, SCSS, Sass, React, ReactNative, Stylus, PostCSS and CSS Crush.

v0.0.1 is compatible with Sketch 3.0.0

Figma Banner

Colors → Code by icanicon.io

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

Export options

• CSS (.css)
• Less (.less)
• SCSS (.scss)
• SASS (.scss)
• Stylus (.styl)
• PostCSS (.css)
• CSS Crush (.css)
• React (.js)
• ReactNative (.js)
• Android (.xml)

Installation

Download the plugin
• Un-zip
• Double-click on colorstocode.sketchplugin

How to use the plugin

• Simply run the plugin and select all colors 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.

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

• Choose your file naming-convention wisely as these names might carry over to your codebase.

More Sketch plugins from icanicon.io

Sketch Icons → Code

Thanks, and enjoy it! Your Sugarcode Team


Join the discussion

Download v0.0.1
Usage Activity
400100

No Sketchpacks Relay integration found

Stats
  • 17 downloads all–time
  • 8 downloads this week
  • 17 downloads this month
About this plugin

Sugarcode-Team published this plugin 22d ago.

v0.0.1 is the latest version.

Native updates are supported within Sketch.app.