PSD files are created by Adobe Photoshop while AI or EPS files are created with Adobe Illustrator. While none of the formats are directly compatible with Figma, in this short guide we'll explore some alternatives on how you can get them into the editor and use them in your designs.
If you're not interested in reading you can simply watch my video tutorial which explains the same concepts but I guess it's more visual - so it's just below.
Now we'll go step by step and talk about the whole process.
Are PSD, AI and EPS vector files?
AI and EPS yes. PSD files can be vectors but most of the times they're not. Let me explain:
If for example there are image layers in the PSD file or even in the EPS file they will not get converted to vectors. It's impossible to convert images to vectors because there are simply way too many pixels in an image that would have to get converted into vectors.
So while you can bring them in Figma, those layers won't behave like vectors. They will simply act like either JPG or PNG images.
Does it matter if they are vectors or not?
Yes. In Figma you can completely move layers around, change colors, create new points on the vector illustrations.
You cannot do that with a PNG or a JPG. The most you can do is make slight color correction adjustments:
How do I import PSD, AI or EPS files in Figma?
Simplest way is to use an online convertor service like magicul. But it's not free to use and it's pretty costly.
The second alternative is you open the files in either Photoshop or Illustrator, go to Save As and export them as SVG files.
The good thing about SVG files is that Figma splits them into layers and they are fully customizable, just like any vector layer.
Some things might get lost in translations and some effects might not port from Adobe to SVG but it's your best shot at getting something from EPS into something that's useable in Figma.
And, again - while layers containing images will also import, they won't behave like vectors because they're not vectors. SVG files convert the images used to base64 code so if the initial PSD or EPS files contained lots of big images your SVG file might end up large and laggy.
That being said, this is the only way that I know of and personally use to get Adobe files to work with Figma. If there are alternatives I would love to hear them from you on our discord group and update this post with simpler solutions, but until then you're stuck with converting them to SVG.
And by the way, you can also use online convertors to get from PSD to SVG or EPS to SVG if you don't have Adobe products installed or available.
- How do I Save a Figma prototype as PDF?
- How do I get better at Figma?
- How do I get SF Pro Font in Figma?
- How do I export a Figma file?
- How do I download fonts to Figma?
- How do I convert PSD to Figma?
- How do I preview Figma on my phone?