# How to Preview the Generated Frontend Code in Build mode?

> MockFlow provides two options to preview the generated frontend code,

Use the ‘Preview’ option in the top right corner to view...

Source: https://mockflow.com/docs/wireframepro/build-mode/to-preview-generated-frontend-code

MockFlow provides two options to preview the generated frontend code,

1. Use the ‘Preview’ option in the top right corner to view the UI inside the editor.

![Youttube full video - Built with AI (8).gif](https://assets.mockflow.com/docs/media/9624cd08f9eee22bca67d169.gif)

1. Click ‘Open in New Window Tab’ to launch a live website preview in a new browser window.

Note - MockFlow provides in-app preview support for limited frameworks

## **Supported Framework Previews**

MockFlow supports live previews for the following frameworks:

1. Tailwind
2. Bootstrap
3. Material
4. Shadcn
5. Ant Design
6. Bulma

These frameworks allow instant UI previews directly within MockFlow.

![Supported Framework Previews - MockFlow Build Mode](https://assets.mockflow.com/docs/media/8ad9181b9e201852c1dc111d.gif)

Watch this video to learn how to generate frontend code for an Android Mobile App UI using MockFlow Build Mode and preview it in Android Studio:

[Video](https://www.youtube.com/embed/W_KwXMMGjMI)

### **Frameworks without Preview Support**

MockFlow does not provide preview for the front-end code generated from these frameworks:

1. React Tailwind
2. React Shadcn
3. React Bootstrap
4. React Ant Framework
5. Vue Tailwind
6. Vue Bootstrap
7. Vue Ant Framework
8. iOS UI
9. iPadOS UI
10. Watch OS UI
11. Android UI
12. Flutter UI
13. MS Windows UI
14. macOS UI

These require an online playground of the desired framework to preview the generated frontend code. You can export the code and open it within the respective framework to preview it.
