Version diffs for Figma

Something changed in this Figma design.Here is exactly what.

Compare any two points in the file's version history and read every layer that was added, removed or modified, property by property, old value beside new.

Start now

Completely free. Sign in with Figma, no setup.

Checkoutv18 → v243 changes
Before · v18
After · v24
Payment cardmodified
Corner radius
8 12
Fill
#FFFFFF #EEF2FF
Padding
16 / 16 / 16 / 16 24 / 16 / 24 / 16
Variables
fills: surface/default fills: surface/selected
Text

Confirm and pay

Review and pay

Pick a change to see what moved addedmodifiedremoved
What you get

What you get out of one comparison

All of it comes from picking two save points. There is no step before that one.

Verify the design got built.

Put the version a screen was built from next to the one on the canvas today and read exactly what moved. Design QA stops being a game of spot the difference across two windows.

Handoff made easy.

One link with every change since the last version, bundled and readable. Less friction between you and the people building it, and nothing for them to piece together first.

Show what shipped, without a walkthrough.

Pick the frames worth showing, give the comparison a title, and send a plain-language summary to someone who is never going to open Figma and read a layer panel.

Keep the design system honest.

Component swaps and re-bound tokens are named as real changes, so a library update reads as a list you can check off instead of a hunt across every screen that uses it.

How it works

Read a Figma filethe way you read a code diff.

  1. 01

    Connect Figma

    Sign in once with your Figma account. Nothing to install, no snapshots to configure.

  2. 02

    Pick two versions

    Any two points in the file's own saved history, from this morning back to launch day.

  1. 03

    Read the diff

    Every layer that changed, grouped by frame and broken down property by property.

  2. 04

    Send it on

    Send the comparison on as a link. Whoever opens it reads the same change list you did.

One Figma file
In the app

Pick a range, read the diff, send the answer

Version history27 saves
  • Current versionAna · today, 09:14v27
  • Checkout polishAna · today, 08:02to
  • Express pay addedSam · yesterdayv22
  • Payment card v2Ana · 3 days agov19
  • Pre-review baselineSam · last Tuesdayfrom
v18 → v24 Compare

Every save the file has, not just the last one

Each version comes with its label, who saved it and when. Compare one against the save before it to read that version on its own, or set the range back a month for everything since.

  • Reads the history Figma already keeps, so there is nothing to set up first.
  • Compare against the live state of the file too, for checking a build against whatever is on the canvas right now.
figma-diffs.app/s/8kQ2f1

Checkout refresh, week 12

Roomier payment card, express pay added, promo banner retired.

  • Checkout6
  • Payment3
  • Summary1
ASMK4 of 6 have read it

Send the answer, not the file

Pick the frames worth showing, give the comparison a title and a description, and it goes out as a plain-language summary of the release for an audience that will never read a property list.

  • Opens for anyone you send it to once they sign in with Figma, without them needing to go near the file itself.
  • Tracks who has opened it, so a review knows when it has actually been read.
Who it is for

Everyone who needs to know what changed

One comparison, read four ways: what slipped through since the last review, the shortest list of edits that closes the gap, what actually landed this cycle, and what to show the people waiting on it.

For designers

Know what you shipped since the last review

  • Catch the change nobody wrote down: spacing nudged inside a nested component, a fill a shade off the token.
  • Walk into a critique with the list already written instead of scrubbing the canvas beforehand.

For developers

Implement the updates, not the whole screen again

  • Compare the version you built from against today and get the exact values that moved: hex fills, half-pixel sizes, padding per side, line height, font weight.
  • See which variable a property is bound to now versus before, with the reflow from hug, fill and auto layout filtered out.

For product managers

See what actually landed this cycle

  • Read a release as a concrete list of changes rather than a demo call and a hope that nothing was missed.
  • Set the range back to the version you signed off on, so "what has moved since we agreed this" has an answer.

For clients and stakeholders

Follow the work without opening Figma

  • A curated review: the frames worth showing, a title, and a plain-language summary of what moved.
  • No canvas to navigate and no layer panel to learn before the update makes sense.
What gets compared

Detailed changes, version by version

Every save point is listed with its label, its author and its date. Compare one against the version before it to read that save on its own, or reach back a month for everything since. Either way, this is what gets compared on every layer.

  • 16

    24

    Layout

    Padding on each of the four sides, the gap between items, and how a frame lines its children up on both axes. Position and size travel with them, measured against the parent so nudging one frame does not flag everything sitting inside it.

  • #FFFFFF

    #EEF2FF

    Style

    Fills and strokes as hex values with their alpha, next to stroke weight, corner radius and opacity. A gradient lists the stops that moved, an image fill names its scale mode, and a swatch sits beside every color so you can see the shift as well as read it.

  • Confirm and pay

    Review and pay

    Typography

    Copy edits highlighted word by word, so you read the words that changed instead of two paragraphs side by side. Around them, the type itself: typeface, weight, size, line height, letter spacing and alignment.

  • blur 4

    blur 16

    Effects

    Drop shadows, inner shadows and blurs, down to the color, the offset, the blur radius and the spread. An effect that was switched off reads as hidden rather than as deleted, because those are different edits.

    • Express pay
    • Payment card
    • Promo banner

    Layers and components

    Layers added, removed, renamed, or shown and hidden, each grouped under the frame it belongs to. Instances say when they were swapped from one component to another, which is the change most likely to look like nothing happened.

  • fills

    surface/default

    surface/selected

    Variables and tokens

    Which variable each property is bound to, and what it means when a binding is added, dropped, or repointed at a different token, per property and per mode. Names and collections where your plan or the companion plugin can supply them, raw ids where neither can.

Figma Community plugin

Go from canvas to diff in one click

Add Figma Diffs Companion and the file comes to you: select a frame in Figma, run the plugin, open that exact frame here. It brings your variables along too, so colors, spacing and type read by name.

Get the plugin

Free, optional, and one run per file covers the whole team.

  • Open the file you are already in

    Run it on the canvas and land here on the frame you had selected. No links to copy.

  • Tokens by name

    Colors, spacing and type styles show up the way your team named them.

  • See what connects to what

    Which token points at which, and what each theme mode resolves to.

Questions

Questions worth answering before you sign in

For designers

How do I see what changed between two versions of a Figma file?

Open the file here, pick two points from its version history, and every layer that was added, removed or modified is listed frame by frame and property by property: size, color, text, auto layout, styles and tokens. There is nothing to install and no snapshot to configure first, because it reads the version history Figma already keeps for the file.

Does Figma have a built-in compare or diff tool?

Not for comparing. Figma saves a version history and can restore or duplicate an older version, but it will not tell you what is different between two of them. You get a list of save points and two canvases to check with your eyes. That gap is what this fills.

Can I see the detailed changes for one specific version?

Yes. Every save point in the file is listed with its label, who saved it and when. Compare a version against the one before it and you get the change list for that save alone: which frames it touched, and every property that moved inside each one, old value beside new. Widen the range to a version from last month and you get everything since, in the same shape.

How do I find what changed in a design system or component library?

The same way, and it is where property-level detail earns itself. A swapped instance, a re-bound variable and a corner radius nudged by two pixels look identical on a canvas at arm's length. Changes come back grouped per frame with a rollup of the styles and tokens that moved, so a library update reads as a list you can check off instead of a hunt.

Can I compare two different Figma files?

No, comparisons run between two versions of the same file, because a file's version history is what defines the before and the after. A duplicate starts a fresh history with no shared point to compare against, so a copy made to try an idea is better kept as a branch or a saved version in the original.

Do I need a paid Figma plan?

No, a free Figma account can sign in and compare. What a free plan limits is how far back you can look: Figma keeps roughly 30 days of version history on the Starter plan and the full history on paid plans, and you can only compare versions Figma still holds.

Can I share what changed with someone who cannot open the file?

Yes, and it is the reason the share links exist. A link serves the comparison that was already captured, so the reader does not need access to the Figma file itself. For an audience that will not read a property list, there is a curated version: pick the frames worth showing, give it a title and a description, and it goes out as a plain-language summary of the release. Either way they sign in with Figma once, which is how a review knows who has read it, and a free account covers that.

For developers

I have to build a screen that changed. How do I get just the delta?

Compare the version you built from with the one you have been handed. What comes back is only the layers that are not the same, and for each of them the old value next to the new one. A redesign that looks like a rewrite usually turns out to be a dozen edits, and this is the list of them.

Does it show exact values, or only that something changed?

Exact values, on both sides. Fills and strokes as hex with alpha, sizes to half a pixel, position relative to the parent, padding on all four sides, item spacing, line height, letter spacing, font weight, stroke weight, corner radius, and shadow color, offset, blur and spread. Text is compared word by word, so a copy edit highlights the words that changed instead of handing you two paragraphs to read twice.

Does it flag layers that only reflowed?

No, and that is deliberate. A layer set to hug or fill is sized by Figma's layout engine rather than by a person, and a child inside auto layout is positioned by it too, so those axes are skipped. Without that, editing one component reports every instance of it as moved and resized, and the real change is buried in a few hundred rows of noise.

Can I see which design tokens or variables changed?

Yes. Variable bindings are compared per property, so re-pointing a fill from one token to another shows up as its own change rather than as nothing at all, and a value moving behind a token is not confused with someone hand-picking a color. Whether those read as names or as raw ids depends on your Figma plan, which the API section below covers.

Is there an API, a CLI or an export?

Not today. A share link is how a comparison leaves the app: it opens for anyone signed in with Figma, without access to the original file, and it keeps working without re-fetching anything. The companion plugin is the other integration point, and it pushes into the app rather than pulling out of it.

Do I need the plugin?

No, it is optional and everything works from the site on its own. It adds two things: jumping straight from a frame you have selected in Figma to that frame here, and design variable names, so colors, spacing and type read the way your team named them instead of as raw ids. One run per file covers the whole team.

Figma API and rate limits

What does signing in with Figma actually give the app access to?

Read access, and nothing else. The consent screen lists current_user:read, file_content:read, file_versions:read, file_metadata:read and project_metadata:read. There is no write scope in that list, so nothing here can edit, move, comment on, rename or delete anything in your files. Your Figma token is sealed into your own session cookie and is never written to the database, and signing out drops it.

Does the Figma REST API have a diff endpoint?

No. The REST API gives you a file's version list and the full document JSON at any one of those versions, and there it stops. Walking both documents, matching layers across them, working out which differences a person actually made and which are the layout engine reflowing, and rolling the result up per frame is all work you do yourself. That work is this app.

Why am I seeing a Figma rate limit error?

Because Figma meters its API per user rather than per app, and downloading a file's full contents is the most expensive call it offers. How much you get depends on your plan and seat type: an editor seat on a paid plan has room to work, while a view or collab seat can be capped at as few as six full file downloads a month. Every app connected to that Figma account draws from the same budget, so the ceiling belongs to your Figma account rather than to this site.

What happens when the limit is hit, and how long do I wait?

The compare stops and shows you what Figma said, including how long it wants you to wait. A short burst clears in seconds or minutes. A wait measured in hours or days means the budget for that seat is spent and it resets with the next cycle. Nothing already loaded is lost: comparisons fetched earlier still open, and share links keep working for everyone you sent them to.

How does the app keep from burning through that budget?

By never paying for the same comparison twice. A diff between two saved versions can never change, so both files are cached and the result is stored the first time it runs. Re-opening that comparison, sharing it, or having five teammates read the same review costs no further Figma calls. Only a genuinely new pair of versions spends anything, and comparing against the live state of a file is the one thing that always has to be fetched again.

Why do variables show as ids instead of names?

Because the endpoint that returns variable names, and the file_variables:read scope it needs, exist only on Figma Enterprise. On any other plan the REST API hands back a binding to something like VariableID:1:23 and no way to ask what that is. The companion plugin closes the gap from the other side: run it once inside the file and it sends the names, collections and modes over, after which the same diffs read in your team's own words.

Stop hunting for what changed.Open the file and read it.

Start now

Completely free. Sign in with Figma, no setup.