How do I use Illustrations in Figma?

How do I use Illustrations in Figma?

When it comes to using illustrations in figma there's a few things you need to know: depending on the type of media file you'll be able or not to make actual changes to your illustration.

If you upload JPG or PNG illustrations you won't be able to change colors or shape of the illustration. SVG's on the other side are scalable vectors which means you can resize, recolor and edit however you want - you have full control.

How do I use Illustrations in Figma?

You can either google for open source or royalty free SVG illustrations or you can use community made plugins directly in Figma that do everything for you. 

First plugin which I personally used is made by freepik and they have many illustration packs and styles to chose from:

Click on the image and try it out to see how it works. You just pretty much search for an illustration, pick the colors and click the import button. 

If later on you're not satisfied with the colors or want to make changes just click on the illustration and you should have color options on the right panel. To move vector points and modify the layers just click multiple times until the illustration gets ungrouped. Or you can also right click and ungroup the illustration - make changes and after that group it again.

If you don't like plugins you can search directly on their website storyset. It's the same library, with the same color changing options. Just download as SVG and drop it into Figma. 

Another plugin I've tried is called Illustrations - pretty cool name, I know:

They have more styles and 3rd illustrations if that's what you're looking for. 

As far as copyrighting goes, you will have to manually check each illustration to be 100% sure you're allowed to sell your design or use it in your prototypes. In theory at least they say it's all be free to use but you never know. 

If you're looking for human illustrations, check out Humaaans:

Personally I've never used it but the illustrations look pretty cool.

Bonus illustrations library: undraw. I've used them for years now and they have a lot of illustrations to chose from. Entirely free to use. 

To summarize, if you're looking for illustration packs to use in Figma you can use plugins such as undraw, humaaans or sites like undraw. Just make sure you export your files as SVG otherwise you won't be able to make color or other type of changes to them.