Creating Icons in Figma [Tutorial & Speedart]

Figma not only gives you a powerful platform to design, prototype, and collaborate on web and apps, but it also has some great tools and features to help you craft your own vector icons for your design projects.
In today's video, we'll see just how you can create simple icons using the pen tool, rectangle and ellipse tool, as well as boolean groups.
If you want to see more figma icons videos or more complex icon tutorials, comment down below.
Try Figma for FREE
www.figma.com/
-----------
Facebook: bit.ly/2B95bV4
Instagram: bit.ly/2mO821c
Twitter: / creativerobbie

[@jsndza]

We need alot more of such videos. This one was amazing. Please do videos on complex icons as well. Would be really helpful

[@RobertBradford2]

Thank you, I'll definitely do more like this in the future.

[@sagarrj23]

Impressive, A perfect cookery show for Designers. I literally started getting cravings for food by the time i finished watching the video. Love the way you have used negative space as border.

[@ChrisLawley43]

Loud and clear, not too fast not too slow. Thank you so much, You gained a sub.

[@atharvasuryawanshi]

Very interesting video for the icon in figma

[@MariannaKrim]

Great video! Thank you!

[@annasubo]

Wow, I was not expecting to hear an intro from my fav YWA channel :) Thanks for the tutorial!

[@zeddnl6514]

damn this is so quick yet i learned a lot. you are a life saver to students!

[@coleheffernan5799]

This was an excellent video, what is a pro of producing the icons in figma instead of in another program like illustrator?

[@nainaingleshwar6775]

Thank you so much for sharing the knowledge! :)

[@theado3183]

Thank you! Very helpful!

[@nickpage9138]

That's talent right there, good skills, thanks it inspired me.

[@WemimoAdewuni]

This is very helpful for beginners like me

[@lilyoo5459]

Thank you very much. Really helpful

[@JorgeTT.]

awesome so creative

[@VadymParnytskyi]

Cool. Thanks for your video.

[@talhajunejo9592]

That's awesome

[@aslamanwerbasha]

Thank you its nice tutorial.

[@fairy.sprout]

very useful, I will try to make one later, btw after i finish creating the icons, can I save it as a svg?

[@theSamGon]

Lag 😵.
Helpful information 🤘🏻

[@keto9423]

That was really helpful. Thank you!

[@nainaingleshwar6775]

This is awesome for beginners like me in UX Design. Subscribed to your channel, hope to learn more about how to make them.

[@ahmadjabbar9121]

wow. very helpful man and learned a lot.

[@Kazwhale]

Nice one Robert. Thank you for this.

[@pablofernandez7772]

Thanks for your awesome tutorials!

[@_CocoLily]

Thank you, 😊 Robert

[@Alexey_Alekhin]

This is really great work!

[@RobertBradford2]

Thank you!

[@Aamnah]

Excellent video, keep it up!

[@RobertBradford2]

Thank you!

[@ranan2591]

Wow! This is exactly what I'm looking for! Thank you!

[@wildtraveler8855]

Amazing! Good job @Robert ! New subscriber here.

[@gracedanye]

Thank you sooo much, very helpful 👌🏽👌🏽🙏

[@RobertBradford2]

Awesome. I appreciate you watching

[@kurtbostelaar8827]

Great tutorial!

[@ahmadjabbar9121]

great work.

[@LooooongDog]

Thanks for this video! This helped me a bunch :)

[@claudianbenet2456]

Nice explanation.

[@RobertBradford2]

Glad you enjoyed it !

[@joshuacochran727]

Great video.

[@RobertBradford2]

Thanks so much Josh!

[@brunaabeijon2903]

Amazing!

[@shreyask6247]

can u make a video on creating or designing alphabets

[@yelamantursynbayev529]

Nice.

[@这个仔真棒]

my god! brilliant!

[@arcanjocassiel3956]

WOW!!! Thank you!!!

[@avibrarbrar]

I love figma.....

[@ZhengCheng]

Thank you!

[@ahmadjabbar9121]

do more of these type of videos please.

[@vishnevskaya3]

It's so good and heplfull, thank you so much, you are brilliant. Please make more this kind of videos and help us to know more about icons, Figma and UI :)

[@lucaasdfg7562]

hi robert i just wanted to ask how do you donwload the tools for editing the circles and rectangels thank you very much for your tutorial

[@ini_oluwa]

He used Figma's built-in tools

[@salsabilaalif1836]

thanks man

[@babimalas2400]

this was amazing, thanks for making this great content 🥰🥰🥰

[@nigoraraxmonova628]

Vidio is very nice. How can make "copy" icon? Thank you!

[@RobertBradford2]

Thanks for watching

[@jeremytitus6575]

super bro

[@anangsuwasto7660]

very nice video

[@goofansu]

Thanks, they are very delicious.

[@jeyachitra88]

Awesome

[@I_like_modeling_Monsters922]

How can you make a grid only showing when zoom in? I feel this feature very effective when working

[@RobertBradford2]

Hmm..I don't believe this is a feature in Figma.

[@yeaheiamahmudhridoy4590]

How can I change icon colour which I pick from flaticon or other site? Have any idea!??

[@RobertBradford2]

Great question. usually when you download an icon from sites like nounproject, before you download, they allow you to change the icon color.

[@yanalintu551]

thanks!!!

[@RobertBradford2]

And thank you!

[@yeshayavarghese350]

None of the boolean effects are available on Figma anymore. Is it only premium now or?

[@markusgattol]

logo design would basically be the same yes? can you export it to an .svg when you do?

[@RobertBradford2]

Logo design is entirely different than icon design. And yes you can export to .svg

[@PHEELL822]

Are you using a Wacom tablet or did you do this with just a mouse?

[@RobertBradford2]

@@PHEELL822 I actually did this with just my mouse. I do however have a touch screen Dell XPS that I sometimes use in the process of making icons.

[@xjfw2]

how do you export those icons? because if i tried i get separated images =)

[@RobertBradford2]

Hmm..Have you tried grouping the elements of the icon together, and then exporting as .svg?

[@xjfw2]

@@RobertBradford2 Hey! i dont know why but in the current project that i was working on i cant export (doing the group thing), but i created a new file and tried your advice and it works! ty =)

[@RobertBradford2]

@@xjfw2 a little weird lol but happy it got worked out :)

[@savitririshma]

@@RobertBradford2 hey, could this icons recoloring by user when they used it? cz once the icons already exported to svg, i cant modified my icon color (for web assets purpose).

[@JO-yh4yc]

Anyone remember when we called icons "Sprites"?

[@lalitbarai]

How to import icons in figma ?

[@RobertBradford2]

You can pretty much just drag your SVG files (or PNG) right into your figma document.

[@zohralakri9977]

This was so cool to watch. The only thing is, the pancake icon looks really odd and crinkly to me. The rest look awesome.

[@cherry-lp8yq]

i wish you kept explaining the design rather than the music :'(

[@aumfox]

wooow =)

[@nhubuivan6078]

aws :D

[@chriskosik663]

Nice explanation.

[@RobertBradford2]

Im happy that this has been helpful to you Chris!

[@uiuxshoaib]

Thanks man

[@RobertBradford2]

Absolutely!

[@Abra_TV]

Amazing!