LiveDemo - Open-source alternative to Storylane, Navattic, and Arcade | Product Hunt

How to Use the Pen Tool in Figma



How to Use the Pen Tool in Figma: step-by-step guide

  1. Navigate to the bottom section of your Figma design canvas and click the 'Pen' icon.

  2. Following that, go back to the canvas and click anywhere to plot the first vector point.

  3. Drag your mouse cursor to your desired position and then click once again to plot another vector point.

  4. Repeat the same series of steps until you form a shape or object.

  5. Once done, head back to the starting point and click on the first vector point to close the path.

  6. If you want to further customize the output, navigate to the floating options above the Pen tool icon. Use the 'Bend' tool to create a curve and the 'Paint Bucket' tool to fill the shape with your preferred color.

  7. After completing these steps, you may now include the final output as part of your Figma design.

Quick answer: To use the Pen tool in Figma, click the Pen icon on the canvas, plot vector points to form a shape, and click the first point to close the path. Customize the output using the Bend and Paint Bucket tools in the floating options, then add the final shape to your design.

About this Figma tutorial

Create custom vector shapes and curves in Figma by plotting points with the Pen tool, closing paths, and applying colors. This guide shows how to use the Pen Tool in Figma in 7 steps, starting with "Navigate to the bottom section of your Figma design canvas and click the 'Pen' icon" and finishing with "After completing these steps, you may now include the final output as part of your Figm...". The interactive demo above is a click-through copy of the real Figma interface, so you can rehearse each step before doing it in your own account.

Frequently asked questions

How many steps does it take to use the Pen Tool in Figma?

7 steps. Each one is listed in order above, and the demo highlights exactly where to click.

Can I try it without changing my own account?

Yes. Clicking through the demo doesn't touch your Figma data or settings. Once you know the flow, repeat it in your own workspace.

This tutorial is filed under Figma. Related guides: How to Use the Slice Tool in Figma, How to Warp Text in Figma and How to Wireframe in Figma. Last reviewed 05 Oct 2026.

LiveDemo - Open-source alternative to Storylane, Navattic, and Arcade | Product Hunt
🚀

Create your first interactive demo in minutes

No credit card required • Start building today

Start free→

This website uses cookies to enhance the user experience.

AcceptDecline