What Figma is

Figma is a collaborative interface-design tool that runs in the browser. Designers use it to draw screens, assemble them into clickable prototypes, and maintain the component libraries behind a product's design system. Launched publicly in 2016, its founding bet was that a design file should behave like a Google Doc: one URL, many cursors, no versions to email around.

That bet is the whole product. A Figma file is a shared place - designers work in it, engineers inspect it, managers comment in it - and everyone is looking at the same, current state. Nothing to install, nothing to sync, no "which version do you have?"

Why it became the default

Interface design tools existed before Figma - Sketch was the standard for most of the 2010s. Figma displaced the category through a few compounding choices:

  • Multiplayer - simultaneous editing was native, not bolted on. Design critique moved from exported screenshots to everyone inside the working file.
  • The browser - no install, every platform, and a share link that just opens. The people who never had the design tool - engineers, managers - suddenly could look at the actual work.
  • One source of truth - files live in shared team space, so "the latest" is wherever the URL points. Versioning became history inside the file, not filenames.
  • A free tier - students and small teams started there, then carried it into companies. The tool spread bottom-up.

The pattern to notice: every one of these is a collaboration feature, not a drawing feature. Figma won by changing who could participate in design, not by drawing better rectangles.

The five concepts that matter

A Figma file looks dense the first time. Five ideas decode most of it:

  • Frames - the artboards. Each frame is typically one screen or one part of one, at a device size.
  • Components - reusable elements defined once and instanced everywhere. Edit the main component and every instance updates - this is how design systems are enforced in practice.
  • Variants - one component's states and sizes (primary/secondary, default/hover/disabled) grouped as a single switchable set.
  • Auto layout - containers that grow, shrink, and space their children by rule instead of by hand - Figma's version of the flexbox model engineers know from CSS.
  • Styles and variables - named, reusable values for color, type, and spacing. These are the design-tool form of the tokens from What is a design system?.

Notice that the last four exist for the same reason: decide once, reuse everywhere. The tool is built around the same discipline the design system encodes.

Beyond the canvas

Around the core editor sits a small suite most teams end up touching:

  • Prototyping - frames wired together with clickable hotspots and transitions, enough to walk a stakeholder or a usability test through a flow.
  • Dev Mode - the engineer-facing view of a file: measurements, colors, and code-ish snippets for inspecting what to build.
  • FigJam - the whiteboard sibling, for flows, brainstorms, and diagrams before screens exist.
  • Community and plugins - public files, UI kits (including the big public design systems), and an ecosystem of plugins for everything from icons to accessibility checks.

Where it sits today

Figma is the incumbent - the shared vocabulary of product design teams, the place design systems are maintained, and the tool job postings assume. Adobe agreed to acquire it in 2022 for about $20 billion; the deal was abandoned at the end of 2023 under regulatory pressure in the EU and UK, and Figma went on to list publicly on its own in 2025.

The moving edge of the landscape is AI. Figma has been adding AI features to its own editor, and a new category of conversation-driven design tools has emerged alongside it - Claude Design being the one covered on this site. The two are less rivals than neighbors today: precision craft and design-system stewardship on one side, fast exploration and working prototypes on the other. Where the boundary settles is an open question worth watching rather than predicting.

Getting started

Figma's free tier is enough to learn the whole model. The fastest route: open a public community file - a UI kit for a design system you already read about - and take it apart. Watch how frames, components, variants, and auto layout are used by people who do this daily; it teaches more than any feature tour.

If you're the manager or engineer being sent Figma links: you don't need to learn to draw. Learn to read - frames are screens, purple means component instance, and the comment tool is how you say something where it will actually be seen.

References