Version Diff helps compare what's changed between versions and visually spotlights those differences both on screen and in the Inspect panel. This means you can’t miss changes anymore, even if it’s a subtle pixel height update or radius adjustment.
If you have multiple versions of your screen, you'll see the "Show differences" toggle switch at the bottom of the Versions panel. When you click on it, Zeplin spotlights changes so that you can compare the selected version with the previous one.
💁♀️ If you’re on a version before Zeplin's Summer Breeze release, you’ll see the “Show differences” option on the bottom left.
If a layer is newly added on this version of the screen, Zeplin highlights it as “green”. If a layer already exists in the previous version but there are changes on it, it will be highlighted as “yellow”.
💁♀️ You can check how many layers were added, changed or removed by checking the green, yellow and red icons under a screen version on the Versions panel.
When you click on the highlighted layer, the right panel shows exactly what has changed, with yellow or green notices.
If a layer has an entirely new value or property or is made an asset, Zeplin highlights the new value in green on the right panel. If there is an update on an existing value, it highlights the updated value in yellow on the right panel. You can hover over these highlighted values to see the previous values of the layers.
💁♀️ If there’s no change in a selected version compared to the previous one, you’ll see “0” next to Version Diff icons of each screen version. Also, the tooltip on the Version History panel will inform you about this.
To dig deeper into this or any other topics related to Zeplin, reach out to our Customer Success crew at success@zeplin.io to schedule a 30-minute call.