Graphic Design: Figma
Figma is one of my favorite tools for designing graphics. It’s ease of use, beautiful UI, and low learning curve make it a great tool to get sh*t done while enjoying the process. In this page, I will share tips and tricks for using Figma.
How to quickly color fill a PNG or SVG Icon using the Pen tool
Many icon sites give away free icons in black or white stroke but require you to sign up for a membership to design in color. We can bypass this relatively easy using Figma’s Pen tool.
- Outline the area you want to fill.
- Add the fill property and choose the color you want.
- Move the vector behind the icon.
- Repeat step 1-3 for all areas you want to fill.
- Select every item and frame selection.
- Export this frame as a PNG or SVG.
Video showing how to color fill an icon using Figma’s Pen tool.
After exporting the image, I uploaded it to Backblaze and linked it to my Notion page as an icon.
The color filled icon in place as a Notion icon