Skip to content
Start free

Edit a v0 or Bolt export visually

To edit a site you exported from v0 or Bolt without another prompt, bring it into Xodia: a Vite and React export opens as its own code from GitHub, and a Next.js app comes in as its live pages, rebuilt as React. Then click and style anything on the page.

Updated

Start freeSupported frameworks

Free plan. No card needed.

The Style panel: a pointer sets the heading's weight to 700 Bold, the heading on the canvas turns bold, the top bar shows Saving and the class font-bold appears in the Code tab.

Step by step

How to edit a v0 or Bolt export visually

Check what you exported first: the steps depend on it. Either way, you end up editing real code on a live preview.

  1. 1

    Check what the export is

    Open the export's package.json. If it lists vite and react, Xodia opens the code itself: follow the next steps. If it lists next, it's a Next.js app, which Xodia doesn't open as code: skip to step 5.

  2. 2

    Put the code on GitHub

    Use the tool's GitHub export, or download the code and push it to a new GitHub repository. Keep the site at the root of the repository, not in a subfolder.

  3. 3

    Import the repository

    In Xodia, connect GitHub in Connections and install the Xodia GitHub App on the repository. Press New project, choose Import from GitHub and pick it. Xodia checks the repository before it creates anything.

  4. 4

    Upgrade Tailwind 3 if Xodia asks

    If the export uses Tailwind CSS 3, Xodia stops and shows the upgrade command and a prompt for your AI. Run the upgrade on a branch, check that the site looks the same, push, and press Import again.

  5. 5

    Or import the live site by its address

    For a Next.js app, or any export you can't push, publish it first. Then press New project, choose Import a website and paste its address. Xodia copies the pages, and Convert to React rebuilds them as React and Tailwind code.

  6. 6

    Edit on the canvas, then push

    Click any element to change its text, image, link or style, at every screen size. Push your edits to GitHub and let your host deploy them, or go live on Xodia hosting.

A Vite and React export

Your export, opened as it is

A Vite and React export opens from GitHub with full visual editing. Xodia checks it before it creates the project and names the file and line of anything it can't run.

  • Styling with Tailwind 4, plain CSS or CSS Modules is edited in its own system
  • If the export uses Bun, pnpm or Yarn, Xodia offers to switch it to npm, once
  • Tailwind 3 gets a guided upgrade first. See the upgrade guide
  • Xodia adds no package or config file of its own. Read the GitHub guide

Xodia's New project dialog asking how you want to start: Start a new site from a template or a starter, Import from GitHub to open a site you already have, or Import a website by its address, with Import from GitHub outlined, and the optional Connect your AI line.

A Next.js app

Import the live site, then convert it

Xodia doesn't open Next.js code. If the site is published, Import a website copies its pages by address, and Convert to React rebuilds them as React and Tailwind code, without AI.

  • Pages keep their addresses and titles, and each one gets a score for how closely it matches
  • Server code, such as API routes and sign-in, doesn't come over: keep it where it runs
  • One import copies up to 4 pages on Free and 10 on Starter. See Import a website

The New project dialog on Import a website: the website address and project name, notes on how many pages your plan imports and what is left out, the box confirming you own the site ticked, and Start import.

Edit

Small changes without credits

Every click, word and style writes the code directly, with no AI in between. Keep your own AI for bigger changes.

  • Six sizes from Phone to Wide, with styles that apply from one size up
  • Double-click any text on the page and type over it
  • Connect Claude, Cursor or any MCP app. Connect your AI

The Xodia canvas at the Phone breakpoint with Edit on: the Navigator lists the page's layers, the selected heading is outlined on the live preview of a bakery site, and the design panel shows its style.

Questions

Questions about v0 and Bolt exports

How do I know which kind of export I have?

Open package.json in the export. Vite and React in its dependencies means Xodia opens the code itself. Next means a Next.js app, which comes in through Import a website instead.

Can I keep using v0 or Bolt after I import?

If the tool pushes to the same GitHub repository, yes. Work on a branch in Xodia and open a pull request, so your edits sit cleanly beside what the other tool pushes. A site rebuilt with Convert to React is a new codebase, so continue there. See GitHub.

Does my backend keep working?

Code that calls a service, such as a database, stays as it is and keeps running. Xodia edits the front end; your tables, sign-in and server functions stay where they are.

Do I need to know how to code?

No. You click, type and pick styles in panels, and Xodia writes the code. Every change is saved as you make it, and nothing goes live until you publish.

Keep exploring

Related guides and pages

See every guide

Primary sources

Official docs

Updated

Bring your export into Xodia.

Start freeSee pricing

May we use Google Analytics to see how people find and use this site? It sets cookies only if you allow it. Cookie policy