Figma is an online design tool for designing websites, apps, brand identities and presentations together with others in real time. It runs in the browser or as a desktop app, and everyone looks at the same file. No more "logo_final_v7.png" in your inbox. Figma is the standard for interface and web design and is increasingly used for brand design and marketing material. This article shows what you actually do with it, how it fits into a practical design process, and where it has limits.
What you do with Figma
Figma is really a family of tools under one roof, each with its own purpose:
| Part | What for |
|---|---|
| Figma Design | Designing websites, apps, logos and brand elements, with vector and layer tools |
| Prototyping | Clickable versions of a site or app, to test before anything is built |
| FigJam | Online whiteboard for brainstorms, flows, workshops and retrospectives |
| Dev Mode | Measurements, colours, spacing and code snippets for developers, straight from the design |
| Figma Slides | Presentations in the same style as your designs, reusing components |
| Figma Sites | Publish simple websites directly from your design, without a separate build step |
| AI features | Generating designs from a prompt, rewriting copy, renaming layers, setting up prototypes |
A B2B service provider might use Figma to design the new website first and test it with a clickable prototype before a single line of code is written. A webshop designs seasonal campaigns and banners in a consistent style there. A local business has a freelance designer set up a simple brand identity and basic website in it.
Why teams use it
- One source of truth. Designer, marketer, developer and client look at the same, current file. No confusion about which version is the latest.
- Comments in place. Feedback sits directly on the design, on the specific element it's about, instead of scattered across an email thread.
- Components and design systems. Design a button, card or header once as a component; change it and it updates everywhere it's used. It's the digital, working version of your brand book.
- From design to build. Developers pull measurements, colours, spacing and even CSS-like code directly from Dev Mode, without measuring everything themselves. Tools like Lovable and Webflow can use Figma designs as a starting point to build faster.
- Test before you build. A clickable prototype lets you test with real users whether a flow makes sense before a euro goes into development. That's cheaper than rebuilding afterwards.
- Version history. You can always go back to an earlier version of the design, and see who changed what and when.
- Plugins and integrations. From stock photos to content generation to directly importing data: the plugin ecosystem extends what you can do out of the box.
Free and paid
Figma has a free Starter plan with a limited number of files and basic functionality, fine for getting started or a small freelance project. There are also paid plans (Professional, Organization, Enterprise) with unlimited projects, shared libraries, unlimited version history and more admin and security. You pay per editor (someone actively designing); people who only view and comment are often free, which makes Figma suitable for letting clients and colleagues follow along at no extra cost. Prices and terms change regularly; check the current information at figma.com.
Figma, Canva or Adobe?
These three are often used interchangeably, but they're meant for different things:
| Figma | Canva | Adobe (Photoshop, Illustrator) | |
|---|---|---|---|
| Strong at | Web, apps, design systems, collaboration | Quick marketing material with templates | Image editing, illustration, print |
| For whom | Designers and product teams | Marketers and everyone | Professional designers |
| Learning curve | Medium | Low | High |
| Real-time collaboration | Yes, the core strength | Yes, basic | Limited |
| Suited to building the brand foundation | Yes | No, only applying it | Yes |
A common combination: the designer builds the brand and website in Figma, the marketing team applies that style daily in Canva for social posts and ads. That keeps the brand foundation sharp and professional while daily content stays fast.
What a typical design project in Figma looks like
- Research and structure. For a website project it starts with a sitemap and wireframes: which pages exist, what goes where.
- Visual design. Based on the brand identity (or built alongside it), the visual layer is added: colours, typography, imagery, components.
- Prototype. Key flows (for example a webshop's checkout process) are made clickable to test.
- Feedback and iteration. Stakeholders and possibly test users comment directly in the file.
- Handoff via Dev Mode. Developers pull specifications and build the website or app, often with Figma open alongside as reference.
- Maintenance. The design system in Figma stays the source for new pages and features, so the design keeps growing with the product.
When Figma isn't the right choice
- You just need a quick social post. Canva is faster and more accessible for that.
- Your team has no design experience and no time to learn. Figma's learning curve is steeper than Canva's; without guidance a team often gets stuck on structure.
- You need complex photo editing or illustration. Photoshop or Illustrator remain stronger for that.
- You just want a simple flyer or document. That's possible, but overkill; Canva is built for that.
What to watch
- Structure. Without clear pages, naming and components, a Figma file quickly becomes an attic, especially with multiple people working in it.
- Ownership. Make sure files live in your organisation's team space, not a freelancer's personal account. The same goes for fonts used and their licences: check whether they're cleared for commercial use.
- A design isn't a website. What looks great in Figma also has to actually work on mobile, load fast and be accessible to people with disabilities. See web design and the WCAG contrast checker.
- Designing too long. A design doesn't need to be pixel-perfect for every page before you build. Design the core and key flows, build, and improve afterwards with real data and user behaviour.
- Handoff confusion. Make sure developers and designers agree on naming conventions and spacing, otherwise time gets lost in Dev Mode on ambiguities.
Frequently asked questions about Figma
Is Figma free?
Yes, there's a free Starter plan with a limited number of files. For more projects, shared libraries and team admin you pay per editor; check the current prices at figma.com.
Can you build a website in Figma?
You design the website in Figma. Building usually happens in a CMS or tool like Webflow, WordPress or Lovable, though Figma Sites also lets you publish simple sites directly from your design.
What's the difference between Figma and FigJam?
Figma Design is for the design itself: pixels, components, prototypes. FigJam is a separate online whiteboard for brainstorming, workshops and collaborating at a more conceptual level.
Can I make a logo in Figma?
Yes, Figma works with vectors and is well suited for it. For complex illustrations with a lot of detail, designers often still use Illustrator alongside Figma.
Do I need to know Figma as a marketer?
Not to design yourself, but it's handy for viewing designs, commenting directly on specific parts and exporting assets yourself without bothering the designer.
Does Figma work with development tools?
Yes, through Dev Mode developers pull specifications and code snippets directly from the design, and build tools like Lovable and Webflow can use Figma designs as a base.
Is Figma suitable for a small business without a design team?
Definitely, especially combined with a freelance designer who sets up the file. You don't need to design yourself to still keep an overview, give feedback and export content.
How many people can work in a Figma file at once?
In principle there's no limit; real-time collaboration is Figma's core strength. In practice it works best with a few active editors at a time and multiple viewers/commenters.
Further reading
Want to know more about a strong website and brand? Read web design and brand identity. Want to look at what you need together? Book a free strategy session.
Figma and AI
Figma is building AI deeper and deeper into the design process: you can generate a first draft from a text prompt, have copy rewritten in the right tone, and have layers automatically renamed instead of "Rectangle 247". Useful as a starting point or to save time on repetitive work, but the result is rarely the finished design. Treat AI output as a starting point, always check brand consistency, accessibility and whether the suggested copy is accurate, and have a designer finish the details.
Questions, or just want to spar?
We're happy to think along — call, email or drop by in the heart of Eindhoven.
