Back to Plugins
Visual Difference

Visual Difference

<p>Compare snapshots of Figma objects to visually compare later as those objects change.</p><p><br></p><p>This Figma plug enables you to add and manage snapshots per Figma page using the Visual Difference dialog. Per comparison, you can:</p><p><br></p><ul><li>Compare baseline and latest versions side by side</li><li>Quickly switch between the comparison and the original artwork to adjust</li><li>Quickly visualize which snapshots have differences and which do not</li><li>Identify when the snapshot was taken and the last time comparisons were run</li><li>Highlight differences by a scalably transparent overlay or fun party mode</li><li>Approve of detected differences to replace a baseline snapshot</li></ul><p><br></p><p>Building upon how Figma enables you to compare visual differences in a branch of the main file, you can use this plugin to:</p><p><br></p><ul><li>Conduct visual regression prior to or independent of Figma branching</li><li>Run comparisons for single objects independently</li><li>Detect differences caused by updating library assets</li><li>Inspect and adjust objects rapidly while comparing</li><li>Discover subtle differences in page mockups</li></ul><p><br></p><p>Made by <a href="https://twitter.com/kevinmpowell" rel="noreferrer noopener nofollow ugc" target="_blank">@kevinmpowell</a> and <a href="https://twitter.com/nathanacurtis" rel="noreferrer noopener nofollow ugc" target="_blank">@nathanacurtis</a> of <a href="https://www.eightshapes.com/" rel="noreferrer noopener nofollow ugc" target="_blank">EightShapes LLC</a>.</p>

diffvisual_differencecomparisonvrtvqatestingsnapshotvisual_regressiondiffing_toolinspect

Plugin Preview

Visual Difference preview

About this plugin

Compare snapshots of Figma objects to visually compare later as those objects change.


This Figma plug enables you to add and manage snapshots per Figma page using the Visual Difference dialog. Per comparison, you can:


  • Compare baseline and latest versions side by side
  • Quickly switch between the comparison and the original artwork to adjust
  • Quickly visualize which snapshots have differences and which do not
  • Identify when the snapshot was taken and the last time comparisons were run
  • Highlight differences by a scalably transparent overlay or fun party mode
  • Approve of detected differences to replace a baseline snapshot


Building upon how Figma enables you to compare visual differences in a branch of the main file, you can use this plugin to:


  • Conduct visual regression prior to or independent of Figma branching
  • Run comparisons for single objects independently
  • Detect differences caused by updating library assets
  • Inspect and adjust objects rapidly while comparing
  • Discover subtle differences in page mockups


Made by @kevinmpowell and @nathanacurtis of EightShapes LLC.

Plugin Details

Version1
CreatedFebruary 22, 2022
Last UpdatedFebruary 22, 2022
CategoryUncategorized
CreatorDirected Edges Plugins
Stats1209 installs, 296 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/ui.html
  • main:dist/code.js
  • Editor Types:
    figma

More Like This

Discover other plugins in the same category.

No similar plugins found in this category.