Preview

See your app in action before it goes live. The preview shows exactly how your app will look and behave in production.

Preview Panel

The preview panel shows a live version of your app. Changes appear automatically as you make edits.

DesktopTabletMobile
RefreshOpen in new tab

Your app preview appears here

Viewport Options

Test how your app looks on different screen sizes:

Desktop

Full-width view for desktop browsers

Tablet

768px width for tablet testing

Mobile

375px width for mobile phones

What to Test

1

Navigation

Click through all links and buttons. Make sure they go where expected.

2

Forms

Fill out forms and submit. Check validation and error messages.

3

Responsive Design

Check all viewport sizes. Make sure layouts adapt properly.

4

Animations

Verify hover states, transitions, and animations work smoothly.

5

Content

Read through all text. Check for typos and placeholder content.

Live Updates

The preview updates automatically when you make changes. If something seems stuck:

  • Click the refresh button in the preview toolbar
  • Wait a moment — complex changes may take a second to compile
  • Check the chat for any errors the AI might have reported

Full-Screen Preview

Click the "Open in new tab" button to view your app in a full browser window without the editor interface. This makes it easier to test the complete user experience.