Framer X includes a standalone Preview window which allows you to see an accurate and live representation of anything that you are creating.

You can open the preview window by clicking on the play icon in the toolbar, or by hitting CMD + P with a frame selected. The preview window in Framer X always mirrors your current selection, which means you can quickly skip to specific states of your design.


When you create a Frame you can choose from a wide selection of preset devices, which is located in your properties panel under Device. Once a Device is selected, your Frame will automatically resize to the desired device its dimensions. The Preview window will then also automatically adjust itself and will, when in presentation mode, show your designs on the selected device for a perfect representation.


Toggle Cursor

By default the cursor is turned off while using your prototype in Preview mode. You can quickly turn this on by selecting Toggle Cursor. This will then turn on the touch indicator. Click on the menu icon in the top-right, select "Toggle Cursor" or hit CMD + Shift + C.

Toggle Hand

To get an accurate feeling of how your prototype would look in the hands of someone else, you can switch on the Toggle Hand feature and simulate it perfectly. Click on the menu icon in the top-right, select "Toggle Hand" or hit CMD + Shift + H.

Rotate Device

Previewing a design and want to quickly switch from landscape to portrait-view? Select Rotate Device and your device (and design) will be altered accordingly.

Keep On Top

Select Keep On Top if you want to cement the preview window stuck in the top corner of your window. This will let you continue with your design while always having the preview in sight (You can kind of compare this to Safari it's Picture-in-Picture mode).

Start your free 14‑day trial.

Enter your email and we‘ll send you a download link for later.

We recently introduced Frames and Shapes, so some information in these videos may be outdated. To learn more visit our Help Center.