> ## Documentation Index
> Fetch the complete documentation index at: https://docs.polymet.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Compare options side by side

> Put two or more designs next to each other, from one branch or several, and spot what changed.

A comparison puts two or more files next to each other on the canvas, so you can pick between options or see what a change did. The files can come from the same branch or from different branches.

## Ask for several options

Ask the agent for options as separate files, then compare them:

```text theme={null}
Design three versions of the pricing page as separate pages:
pricing-simple with one plan, pricing-cards with three plan cards,
and pricing-table with a feature comparison table.
```

Each option becomes its own page with its own canvas node. Then make a comparison from any two or three of them.

## Make a comparison

1. Click **Compare** above a node. Or open the file list and click the plus next to **Comparisons** (**New comparison**).
2. The dialog lists your branches under **Branches**. Your default branch and the branch you are on start ticked.
3. For each ticked branch, open its file picker and choose one or more files. Two files on one branch are enough.
4. Click **Compare**.

The comparison appears on the canvas next to the node you started from, or in the middle of the screen if you started from the file list.

The **Compare** button stays grey until you have picked at least two files. A branch nobody has opened yet can't be ticked: open it once, then come back.

## Look at it three ways

The first buttons in the comparison's toolbar switch how the files are shown:

| Mode | What you see | Settings |
| - | - | - |
| **Side by side** | The files in a row | **Scroll together** keeps them at the same scroll position. Click it again to scroll each on its own |
| **Overlay** | One file on top of the other | **Top preview's opacity** fades the top file. **Highlight differences** blacks out everything that matches, so only changes stand out |
| **Swipe** | One file split by a divider | Drag the divider across to reveal one file or the other |

**Overlay** and **Swipe** work with exactly two files. A comparison of three or more uses **Side by side**.

## Use the previews

A comparison shows the live screens, but they ignore clicks until you unlock it. Double-click it, or click **Enable interaction** in its toolbar, to click through the screens. Click **Open focus view** to see it full size.

## Keep it up to date

Each preview stays exactly as the file looked when you made the comparison. Its label says **Pinned** and how long ago, for example "Pinned 2h ago". That way a comparison still shows what you compared, even after the files change.

* When a file has changed since, an amber dot appears on its label and on the update button.
* Click the update button (**Update every preview to its branch's latest build**) to bring every preview up to date.
* If a branch is deleted, its preview keeps its last state and its label is tagged **Deleted**.

## Change or remove it

* **Change what's compared** opens the same dialog with the current files picked. Add or remove files, then click **Save**. Files you keep stay as they were; files you add show their current state.
* **Remove comparison** deletes the comparison. The files themselves stay.

Every comparison is also listed under **Comparisons** in the file list. Click one there to jump to it.

You can only make or change comparisons on the latest version. On an older version, **Compare** and **New comparison** are greyed out and say **Go back to the latest version to compare.**

## Related

* [Branches](https://docs.polymet.ai/team/branches.md) — try a change on a parallel copy, then compare it with your default branch
* [Pages, components and files](https://docs.polymet.ai/canvas/files.md) — the file list and its Comparisons section
* [The canvas](https://docs.polymet.ai/canvas/canvas.md) — moving and resizing canvas nodes
* [Write better prompts](https://docs.polymet.ai/canvas/prompting-guide.md) — how to ask for options that are easy to compare


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.