How to convert Photoshop design to a layered Sketch file?

Matous Roskovec

Are your switching to Sketch from Photoshop, but don’t have the time to recreate all your designs? In this tutorial, we’ll show you how to do it automatically, for free and in a matter of minutes.

Using our PSD to Sketch Converter is really no brainer. Let's just quickly go through the flow.

1. Go to avocode.com/convert-psd-to-sketch

NOTE: Please make sure to read this section, about what can be currently converted. (TLDR: It converts layers, layer groups, text layers, vector shapes, basic layer effects, layer masks, guides and more.)

2. Choose your PSD, add an email address, and wait for the upload

The upload, processing, and conversion time (between you see “Completed” and the moment when you receive the e-mail with a download link) depend on the size and complexity of the PSD file. The smaller the file, the faster the conversion.

3. Check your e-mail box and download your Sketch file

By now, there should be an email with a download link in your email box. Open it and click “Download Sketch file”.

Notice that the Sketch file size is significantly smaller. Go vectors!

Curious about Avocode?
Learn everything in our Weekly Webinar.

It takes just 11 minutes to be a Pro.

4. Before you open the design…

Well, you can open it just now, but bear in mind that:

  • This is a Beta version and only these design features can be currently converted.
  • All converted Sketch designs can be opened in Sketch app Version 43 and later.
  • You should have installed all of the fonts from the original PSD file to be able to see them in Sketch.

Here are some PSD to Sketch Converter results:

5. Try it and let us know what you think about the result

Photoshop data format is significantly different from Sketch JSON. Some things — like Smart Objects or particular layer effects — simply don’t exist in Sketch, therefore cannot be replicated.

List of features we’ll be adding/fixing soon:

  • Text layers (bounding box line height)
  • Circular gradient, Radial gradient
  • Layer styles (Inner glow, Outer glow)

In the meantime, if you stumble upon a problem, please report it here.

Share this article

Want to get ahead of your competition?

Learn how to be a better designer and engineer from our interviews with leaders from companies like Intercom, Dribbble, or Figma.

Get the all new Avocode today.

New features. New look.
Greatly improved performance.