Preview: See Your Application in Real-Time
Manus provides a live, interactive preview of your web application throughout the entire development process. This allows you to see your changes as they happen and test your application’s functionality in a real-world environment.Desktop/Mobile
The preview window allows you to toggle between desktop and mobile views, ensuring your application is responsive and looks great on all devices. You can test the user experience on different screen sizes and make adjustments as needed to optimize for both desktop and mobile users.Path
The preview window includes a URL bar that displays the current path of the page you are viewing. This is useful for navigating to specific pages within your application and for understanding the URL structure of your site.Fullscreen
For a more immersive experience, you can expand the preview to fullscreen mode. This is particularly useful for presenting your application to stakeholders or for getting a better sense of the overall look and feel of your site without the distraction of the surrounding interface.Edit: Effortless, Conversational Changes
Editing your web application in Manus is as simple as having a conversation. There is no need to write code or navigate complex menus. You can make changes to your site by describing what you want in natural language, from single tweaks to large-scale updates.Single Edits
You can modify the visual appearance or structure of any element on your page with a simple command.| Edit Type | Example Prompt |
|---|---|
| Styling | "Change the font of all headings to Georgia." |
| Layout | "Increase the spacing between the items in this list." |
| Content | "Change the text of the main button to 'Get Started Now'." |
| Structure | "Duplicate this section and place it below the contact form." |
Batch Edits: Multiple Changes at Once
“Okay, let’s make a few changes. First, make the main heading bolder and change its color to our brand’s dark blue. Next, adjust the spacing in the pricing table to be more generous. Finally, change the background color of the entire footer section to a light gray.”Mantus will understand the distinct requests within your prompt and execute all of them in one go, saving you time and effort.
AI Edit: Your Creative Partner
For more complex or creative changes, you can use the AI edit feature. Simply select an element and ask Manus to improve it. This is like having a design consultant and copywriter at your fingertips.| Goal | Example Prompt |
|---|---|
| Improve Copy | "Rewrite this headline to be more engaging and benefit-oriented." |
| Enhance Design | "Suggest a better, more modern color palette for this section." |
| Refine Layout | "Restructure this feature list to be more visually appealing and easier to scan." |