---
title: "What is Modeinspect"
description: "Design, prototype and ship changes on your team's real product, and hand engineers a pull request instead of a mockup."
url: https://help.modeinspect.com/en/articles/8-what-is-modeinspect
collection: "Get started"
updated: 2026-11-04
language: en
---

# What is Modeinspect

Design, prototype and ship changes on your team's real product, and hand engineers a pull request instead of a mockup.

Modeinspect is a design tool that works on your team's real product. You open a page of the running app on a canvas and change it with design controls or by asking an agent. You see the result live, and you finish with a pull request for engineers to review.

It is for product designers and design engineers on teams that build with React and Next.js, styled with Tailwind. You design on the product, and the code is the output. You do not write it.

![The demo shop running live in a Portal on the demo canvas, next to the Portal's design panel with Open Build Mode](https://staticfiles.gleap.io/p6a1872808f187689a3937fa3/BZEG5IsoIm7LvYmj3jJZIFuw2xt9Uo7ZWEchB657zw54kStSverVjYI2NCwnbbF1JtJ64TyelTw.png)

## How it fits

Every design starts in your product and ends in your product.

1.  Start in the existing product: place a live page of your app on the canvas with a Portal, or capture a page or a selection as editable layers.
    
2.  Explore on the canvas with frames, text, your design tokens and your real components, by hand or with the canvas agent. This is Explore Mode, and your codebase stays untouched.
    
3.  Switch to Build Mode and put the design where it belongs on the page. The coding agent writes the code and runs it as a live prototype in your product.
    
4.  Share a preview link, or open a pull request for engineers to review.
    

The app runs in a cloud environment Modeinspect hosts, so there is nothing to install. It shows real data when your environment points at a real backend.

## What it does not do

-   It does not import a Figma file. You paste layers, or a link to a frame, onto the canvas. See [Paste a design from Figma](https://help.modeinspect.com/en/articles/42-paste-from-figma.md).
    
-   It does not skip code review. Every change reaches your product through a pull request your engineers approve.
    
-   It does not work on codebases outside React and Next.js with Tailwind.
    

## Next

-   [Start your first session](https://help.modeinspect.com/en/articles/9-your-first-session.md)
    
-   [What happens during setup](https://help.modeinspect.com/en/articles/17-what-happens-during-setup.md)
    
-   [What is Build Mode](https://help.modeinspect.com/en/articles/30-what-is-build-mode.md)

## Related

- [Start your first session](https://help.modeinspect.com/en/articles/9-start-your-first-session.md)