Visual Editor for Cursor

Create stunning UIs in Shuffle, then take full control with Cursor. Sync projects locally and accelerate your workflow — all powered by the Shuffle CLI.

Try Visual Editor → Open the README

shuffle.dev

Cursor

Shuffle CLI: Create a bridge between Shuffle and Cursor.

user@host:~/demo$ npx @shuffle-dev/cli --help

user@host:~/demo$ npx @shuffle-dev/cli get example-project .shuffle --rules=cursor

Example Cursor queries: * Create a next.js app from .shuffle directory (to start) * Add new pages to my next.js app from .shuffle (to update)

The best of both worlds: visual creativity meets AI coding

Step 1 of 3

Build visually in Shuffle

Shuffle gives you 13,400+ responsive UI components to kickstart your projects — and with intuitive drag and drop, assembling beautiful layouts is faster than ever.

Try Demo

Step 2 of 3

Synchronize with your local machine

Download your project instantly using the Shuffle CLI. It connects your visual designs to your development environment, keeping everything in sync — no copy-paste required.

~$ npx @shuffle-dev/cli --help ~$ npx @shuffle-dev/cli get <project_id> .shuffle --rules=cursor ~$ npx @shuffle-dev/cli sync <project_id>

You can find your project ID in the URL of the opened project, for example:

shuffle.dev/editor?project=cd0f7e984aed20beb2406e59502e7d26c44bc15f

Learn about all available commands in the README.

Step 3 of 3

Ask Cursor for changes

Once your code is synced, use Cursor's AI to make edits instantly. Refactor components, tweak styles, or generate new sections — just describe what you want, and let Cursor handle the rest.

Example Cursor query:

Create a Vue project based on the .shuffle directory. Update text content and images to reflect a purpose of the website: selling invisible umbrellas.

Why use Shuffle + Cursor?

Combine the speed of Cursor's AI coding with the precision of Shuffle's visual editor to deliver production-ready websites—without compromise.

Design Visually, Stay in Code

Shuffle gives you complete visual control over real code. Cursor helps generate and update that code with AI. There is no need to rewrite or refactor manually.

Build the Frontend. Smarter.

Create beautiful, responsive layouts in Shuffle. Let Cursor fill in the logic, components, and boilerplate. Together, they handle everything from pixels to props.

Iterate Without Rewrites

Shuffle makes UI changes effortless. Cursor helps update your codebase intelligently. Edit visually and regenerate what you need - without breaking flow.

Visual + AI = Your New Superpower

Imagine prototyping in Shuffle while Cursor writes supporting code. Tweak visuals in real-time, then use AI to scaffold backend logic, data hooks, or state. Fast!

Deliver Weeks Faster

No more back-and-forth. With Shuffle + Cursor, your entire product team moves faster, especially during early builds and the final polish.

Built for real teams. Works with real code. No lock-in.

Shuffle and Cursor bring the best of visual editing and AI together for devs who ship.

The easiest way to create beautiful websites

Solo 1 account

Company 5 accounts

monthly

$24/month

That's $0.80/day

annual

$99/year

That's $0.27/day

lifetime

$249/paid once

Best value

monthly

$48/month

That's $1.60/day

for 5 accounts

annual

$198/year

That's $0.54/day

for 5 accounts

Annual Subscription

Create an account

OR USE EMAIL

I agree to the terms of use and privacy policy.

VAT included where applicable. Invoices provided.

Why creators choose Shuffle

From idea to beautiful design in minutes.

Shuffle pairs an AI visual editor with 80+ UI libraries, so you can design, build and export production‑ready code without starting from scratch.

An AI Agent that builds with you Describe a page, watch it come to life, then fine-tune it visually or with a prompt.
Pick the best model for every task GPT-6 Astra, Claude Opus 5.5 and Gemini 4 Argon in one place.
13,400+ professionally designed components Prefer building by hand? Drag in pixel-perfect sections crafted by professional designers.
Export to the stack you love Next.js, Astro, Laravel, WordPress, Shopify, static HTML and beyond.

“Its AI-powered features have transformed how I work! Designing and building websites has become faster, easier, and far more efficient.”

Est. 2019

Helping web builders ship since 2019 7 years of steady development.

Redirecting to PayPal

Supporting tools

Plans

Visual Editor for Cursor

The best of both worlds: visual creativity meets AI coding

Build visually in Shuffle

Synchronize with your local machine

Ask Cursor for changes