There's a chance that I may have once stretched the truth about my Figma proficiency only to have my skills tested in real time—in front of a team of designers. (How you're imagining that went is exactly how it went.)
Not a shining career moment by any stretch of the imagination, but one of those "it made me who I am today" bits where I can now confidently—and honestly—say that I can whip you up a basic wireframe in Figma if you needed one. (How aesthetically pleasing that wireframe would look is beside the point.)
Here's everything you need to know about Figma.
Table of contents:
What is Figma?
Figma started out as a web-based alternative to desktop design tools, but it's quickly become the gold standard when it comes to digital design. Its biggest selling point is that your whole team can work in the same file at the same time.
Everything happens on an endless canvas made of frames (basically artboards). Your pages and layers live in the left sidebar, the right-side panel is where you tweak things like color and padding, and the toolbar at the bottom has the tools you'll draw with. (More on how to use Figma in a bit—or you can jump ahead.)
Figma started off as one app, but it's evolved to add a whole slew of dedicated apps, including:
Figma Design: The original app where you'll do most of your design work.
FigJam: An online whiteboard for brainstorming and mapping out flows.
Figma Slides: A presentation tool that lives in the same workspace as your designs, so your deck doesn't need its own app.
Dev Mode: A developer-focused view of a design with measurements and code snippets.
Figma Draw: Vector tools for drawing icons and logos without leaving Figma.
Figma Buzz: A template-based tool for making on-brand marketing assets at scale, which comes in handy when someone asks for 40 versions of the same social post.
Figma Sites: A tool for designing and publishing websites straight from Figma.
Figma Make: An AI tool that turns prompts or existing designs into a working prototype or web app. It's part of Figma's broader set of AI features, including Figma Agents, which is more of an AI assistant you chat with to create and edit designs.
Most people, especially wannabe doodlers like me, stick to only Figma Design and FigJam (perfectly respectable choices from the smattering of options). Plus, once you've got the basics of Figma Design down (think: layers, vectors, stroke, fill—all the design stuff), the rest of the apps will feel familiar, just more focused.
What is Figma used for?
My earliest memories of using Figma was only to pop into a designer's file to leave feedback (most of which was "Whoa, cool"). These days, Figma is where just about anyone with a stake in how something looks ends up working together—from engineers checking specs to product marketers polishing a launch deck. Here's how I most often see Figma used at Zapier, team by team:
Design teams use Figma to design anything and everything. For example, social media posts, billboards, and brand logos. Or even complete websites and apps, along with clickable prototypes so everyone can see how they'll behave.
Product teams work closely with design teams, leaving comments on mockups in Figma Design. They also use FigJam to sketch out user flows.
Engineering teams use Dev Mode to get a developer-focused view of the same design file a designer's working in, making it easy to grab measurements and code snippets without pinging back and forth.
Product marketing teams use Figma Slides to build launch decks and Figma Buzz to create on-brand assets at scale.
Email marketing teams use a combination of Figma Design to mock up newsletter layouts and FigJam to map out email marketing campaigns.
Content marketing teams (that's me) use Figma Design to create infographics and Figma Buzz to build hero images for blog posts from templates.
How to use Figma
Opening a blank Figma file for the first time can feel intimidating, especially if all you're used to doing in there is just leaving just "Whoa, cool" comments on someone else's design. You don't have to learn everything at once, though.
A handful of tools cover most of what you'll use in Figma, and you can pick up the rest as you go. To follow along, go to figma.com and log in (or sign up for free) and open a new file in your browser. Here are the most common tools you'll use. (I'm using the Figma desktop app, but it works similarly on the web.)
Files and frames
Every project you start in Figma lives in a file, and each file holds frames, which are the individual screens or slides you're designing. You can size a frame to match whatever you're working on, like a phone screen or a desktop web page, so you can see how your design will look in the real world.
Shapes, text, and images
Shapes, text, and images are the building blocks of nearly every design. You can access them from the toolbar (floating at the bottom) to draw shapes and type text right onto a frame, or drop in your own images. From there, use the right side panel to adjust things like color, font size, and padding until it looks the way you want.
Auto layout
If the idea of having to manually align all your objects just so makes you want to renounce all design apps, use Figma's auto layout tool. Say you've scattered a few shapes or buttons across a frame (like I did in the demo above). You can select all the shapes you want to align, press Shift+A, and Figma will line them up in a tidy row or column with even spacing between them. It also adjusts objects as things change—so a button with a text label, for example, grows or shrinks as you edit the label. And a list reflows whenever you add or remove an item.
Components
Components are reusable design pieces. You can build one main component, like a product feature card or a button, and every instance (copy of a component) you create stays linked to it. So when you edit the main component, every instance updates too. Just be sure to always copy from the main component, not an instance—otherwise, Figma will treat regular copies as standalone elements (changes you make to the main component won't apply).
Prototypes
A prototype is an interactive mockup of your app or website. You link frames together and tell Figma what should happen when someone clicks something—for example, when you click "Sign up," it should open a form page—and the result behaves a lot like the real thing. You can share a prototype with a link, so teammates and stakeholders can click through it and leave feedback before a developer builds anything.
Comments and sharing
Once you've got a file going, you can share it with teammates by email or via a link, and you can give them view-only or full edit access (though editing requires a paid Figma plan). Anyone with access can leave a comment right on the design, keeping feedback attached to the thing it's about.
Community
This isn't a tool per se, but by golly if it isn't a critical component to making the design process that much easier—especially for newbies like me. Community is a library of free and paid templates and plugins (add-ons that give Figma extra functionality) made by other Figma users that you can duplicate, tweak, and make your own.
Figma pricing: Is Figma free?
Figma offers a free forever Starter plan, which includes unlimited drafts that you can share with unlimited viewers, access to design kits and templates, and 150 daily AI credits (up to 500 each month). If you rely on Figma's AI tools, like Agents or Make, you'll run into these limits fast. But if you're just using Figma casually, a free plan is plenty to start with.
To get full seat access—the minimum I'd recommend to get more AI usage and to effectively collaborate with others across multiple files—you'll need a paid plan, which starts at $16/month, billed annually.
The cheapest way to run a team is to match seats to what people actually do. Designers get Full seats, developers who only inspect designs get Dev seats, and stakeholders who only join brainstorms or review decks get Collab or free View seats.
Automate Figma with Zapier
Figma is great if all you need to do is work within the Figma universe. But chances are, your work spans beyond that. Zapier bridges that gap, connecting Figma with 9,000+ apps so you can automatically do things like get notified in Slack when there's a new comment on your design or create a Jira ticket from new Figma comments. Build from wherever you work, and automations will run reliably on Zapier. Learn more about how to automate Figma.
What is Figma: FAQ
Still have questions? Here are answers to the ones people ask most.
Is Figma good for beginners?
Yes—with a small caveat. Getting started is easy, especially if you use a Community template and make little tweaks here and there. But Figma does have a steep learning curve. I'm years into using Figma for basic designs and I still can't get Auto layout to consistently work the way I need it to (but that's very likely a me problem). The upside is that there are plenty of free tutorials—from Figma and the Figma users—that walk you through how to use practically every Figma element.
Is Figma the same as Canva?
No, but they do overlap quite a bit. Both are design tools, but I'd argue Figma has a much steeper learning curve than Canva—although that's changed now that Figma's introduced Figma Buzz and Figma Slides.
If you want to see what Canva's all about, check out our beginner guide to using Canva.
Figma vs. Canva: Which is better to use?
It depends on what you're making. If you're designing something that will turn into software, like a website or an app, or your team already works in Figma, go with Figma. If you want to quickly whip up a social post or a banner to celebrate your dog's birthday, Canva is the better pick—especially for beginners.
But plenty of teams use both: Canva for quick marketing graphics and Figma for product design. If Canva isn't the right fit, check out our roundup of the best Canva alternatives.
Do I need to download Figma?
No. Figma runs in your browser, so you can open a file and start designing without installing anything. There's also a desktop app for Mac and Windows if you'd rather have Figma in its own window than lost among your 47 other tabs.
Related reading:
