# Use the preview Source: https://modulify.ai/docs/editor/preview Read the live preview, move between pages, and change the viewport. The Preview tab runs your working copy of the site in a real browser frame. It is the site itself, not a screenshot, so links work, forms render and scripts run. It updates as chat makes changes, and none of it is public until you publish. ## Wait for the preview to start The first time you open a project the preview has to boot. A status pill sits above the frame and names the current step: `Resuming preview...`, `Provisioning preview...`, `Booting preview...` and `Syncing your files...`. While AI is applying changes the same pill reads `Applying changes...`, and while your work is being saved it reads `Saving your changes...`. If a step fails the pill turns into `Could not load your files` with a **Retry** next to it. The buttons on the address pill stay disabled until the preview is up. Refresh and full screen say `The preview is still starting` while you wait. ## Move between pages The address pill in the centre of the header shows the current path. Click it and a menu opens listing your pages in three groups: - **Static Routes**, which you can open - **Dynamic Routes**, which are listed for reference and cannot be opened directly - **Utility Routes** Type into the pill to filter that list. If what you type is not one of your pages, a **Go to** row appears so you can open the path anyway. Press Enter to navigate, Escape to close. Hover the page tab at the left of the pill and a card shows what that page reports about itself: favicon, title, meta description, tags, and the social preview image. When there is no image it reads `No preview image`. ## Refresh, full screen and viewport Three controls sit at the right of the address pill. The circular arrow reloads the frame. Its tooltip is **Refresh**. The expand arrows open **Full screen**. The site fills the window, the toolbars disappear, and an **Exit** button with the `Esc` shortcut appears in the top right. Full screen is disabled while an unfixed runtime error is showing, with the tooltip `Fix the runtime error to open full screen`. The device icon switches the viewport. **Desktop** uses the full width, **Tablet** renders at 768px wide and **Mobile** at 375px. The choice is yours alone and does not change the site. ## Switch language If your site has more than one language, the two-letter code next to the device icon switches which one the preview renders, and the CMS tab follows the same choice. Pick a language from the menu, or click the small cross on the code to go back to the default. When there is only one language the menu reads `No other languages` and offers **Ask AI to add a language**, which drops that request into chat for you. [Multiple languages](/docs/data/languages) covers how a site gains a second language in the first place. ## When something breaks If the page throws at runtime, the frame is replaced by a **Runtime error** panel that says `Your site hit a runtime error. Use Fix with AI to repair it.` The **Fix with AI** button attaches the error to chat and sends you to the conversation. The raw error text is shown underneath. Some pages cannot host the editing tools. On those you get a small `Editing tools unavailable here` notice with a **Retry**, and selecting, inline editing and commenting are unavailable until the connection comes back. ## Next - [Select an element](/docs/editor/select-element) targets a specific part of the page in chat. - [Edit text inline](/docs/editor/edit-text) changes copy without asking AI. - [Publish a site](/docs/publish/publish-a-site) turns the preview into the live site.