Then you simply take the Adobe Illustrator file and drag & drop it to Avocode.

Once the file import is finished you can double click to open it.

Then you can view each artboard of the file and slice it for export.

Just click around to select layers and export them in any resolution or format (PNG, JPEG, SVG, WebP).

Looking for a quick way to turn AI files to websites and mobile apps?

You’re not alone.

We found out that many companies still use Illustrator due to leadership preference, legacy design files that are still used or simply because the modern lightweight design tools cannot match Illustrator’s vector graphics feature set. In fact, over 1000 people have asked us to do something about this.

Illustrator is apparently still a popular tool for designers, but it’s a nightmare for developers.

If you too are tired of red-lining AI files for developers or exporting all assets one by one for different resolutions or measuring objects with the selection tool in Illustrator, you might want to keep reading.

With Avocode you can also measure sizes and distances and auto-generate CSS, Swift, Android and React Native code just by clicking on layers. You can also pick color codes in HEX, HEX8, RGBa, HSLA, or UIColor.

Or you can simply share the file via a link with developers and they can do the same thing — open the file without Adobe Illustrator.

This is how the whole thing works:

To explain your design thinking or to leave feedback, just switch to the Comment mode, click or drag on the canvas and start typing. You can mention other team members and change the color of the comment based on priority or status.

If you have agreed on a design iteration and you would like to add a new design version, just drag & drop the new version of an Illustrator file onto an existing one. You can also sync the AI file via our plugin — just make sure it’s named just like the one before to create a new version. All versions are sorted chronologically and you can switch between the design file states any way you like.

Why your developer will love you for using Avocode to share AI design files?

Before we have started building the AI hand-off feature, we asked around what people would like use it for:

“We could save a lot of time on having to semi-manually export Illustrator to PSD. Also, it would be nice to make developers’ lives easier.”

Now you can save time on pouring illustrations to Photoshop and maintain vectors instead of having everything rasterized. Plus you can save money (and developers patience) on buying Illustrator licenses and keep everything in vectors.

“Currently, I have to paste AI designs into XD, fix up errors, then push XD to Avocode.”

Good news is that you can import AI files to Avocode directly now.

“It would be super cool to have a live library that was automatically updated on web/in an app, managed in Avocode, and designed in Illustrator/Sketch.”