Skip to content
Start free

Edit a Cursor website visually

To edit a website Cursor built without writing another prompt, import its repository into Xodia and click any text, image or style on the live preview. Cursor can keep working on the same code through Xodia's MCP server, so the quick changes are yours and the big ones stay with your AI.

Updated

Start freeConnect Cursor

Free plan. No card needed.

The Xodia editor with Edit on: a pointer clicks a bakery site's heading and double-clicks it, the formatting bar appears, new words replace the old ones in place and the top bar shows Saving while the change is kept.

Step by step

How to edit a Cursor website visually

Six steps from the folder Cursor wrote to a change on your live site. The code stays the code Cursor wrote.

  1. 1

    Put the site's code on GitHub

    Push the folder Cursor worked in to a GitHub repository. The site should sit at the root of the repository, with its package.json or HTML pages there.

  2. 2

    Connect GitHub and import the repository

    In Xodia, open Connections and connect GitHub, then 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, then opens the site in a live preview.

  3. 3

    Upgrade Tailwind 3 if Xodia asks

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

  4. 4

    Click what you want to change

    In the Design tab, click any element. Double-click any text and type, swap an image or a link in the panel, and change colour, size and spacing in the Style panel. Pick a screen size in the top bar to change the layout on phones only.

  5. 5

    Connect Cursor to the same site

    In Cursor, add a remote MCP server with the type Streamable HTTP, sign-in with OAuth and the address https://app.xodia.ai/mcp. Sign in to Xodia when Cursor asks. Cursor now works on the same live preview you see in Xodia.

  6. 6

    Push, then pull in Cursor

    Push your edits as a commit to a branch, open a pull request if you review changes, and deploy. Then pull the branch in your local folder, so Cursor's copy has every change made in Xodia.

What opens

Check your stack before you import

Xodia runs your site in the browser, so it opens a set of stacks with full visual editing. It checks the repository first and names the file and line of anything it can't open.

  • React with Vite (with or without React Router) and plain HTML sites open with full visual editing
  • Styling with Tailwind 4, plain CSS or CSS Modules is edited in its own system
  • Tailwind 3 gets a guided upgrade first. See the upgrade guide
  • A Next.js or Astro site is refused at import. If it's live, Import a website copies its pages and Convert to React rebuilds them. See frameworks

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.

Keep Cursor

Cursor and the canvas, on one site

Over MCP, Cursor reads and edits your site in Xodia, takes screenshots of the live preview and runs checks on its own work.

  • Select an element, type a request in the ask box, and ask Cursor to work on your Xodia requests
  • Its changes land next to yours, for you to review before you push
  • Connecting works on every plan, Free included. Set up Cursor

Xodia's New project dialog on its first step, with Connect your AI opened under Start a new site, Import from GitHub and Import a website and the Other tab open: add a remote MCP server with Streamable HTTP, OAuth sign-in and the Xodia MCP URL, then sign in and ask.

Push and deploy

Every change is a commit in your repo

Pushes go to your branch with your name on them. Your host deploys the live branch as it does today, and a pull in Cursor brings every change back to your folder.

The Push to Git dialog in Xodia: it commits every change on main since the last push with the message Make the hero heading bold, and takes a restore point.

Questions

Questions about editing Cursor sites

Do I have to stop using Cursor?

No. Connect it to Xodia and it works on the same site. Use the canvas for quick changes and Cursor for bigger ones.

Does Xodia change how my site is built?

No. It writes changes into the same files, in the same framework and styling, and adds no Xodia package or config file to an imported repository.

Cursor wrote a Next.js site. Can I still edit it?

Not as its own code: Xodia refuses Next.js at import. If the site is live, Import a website copies its pages and Convert to React rebuilds them as a Vite, React and Tailwind site you can edit and host anywhere. See Import a website.

Can I edit without GitHub?

Yes, if the site is live: Import a website copies its pages into a project kept in Xodia's storage, and you can connect GitHub later. See Import a website.

Keep exploring

Related guides and pages

See every guide

Primary sources

Official docs

Updated

Open your Cursor site in 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