Loading video...

Video Failed to Load

Go Home

You can now run MagicPath as a native canvas inside Codex to design and build functional apps. It's pretty incredible. Here's how to do it 👇

335,972 views • 4 months ago •via X (Twitter)

55 Comments

Pietro Schirano's profile picture
Pietro Schirano4 months ago

First, grab the MagicPath skill, just paste this inside Codex. The agent will walk you through the installation, logging into our app and the CLI. "Install this skill npx skills add --skill magicpath" If you get stuck, just ask Codex for help.

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Then open the web browser pointing to log in, open a new file, and you're done. We built the skill so Codex is aware of your open project (you can also ask Codex to work on any file you want, or start a new one).

Pietro Schirano's profile picture
Pietro Schirano4 months ago

For extra coziness, I recommend collapsing our chat and resizing the Codex one, it literally looks like an entire new app.

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Because of how Codex browsers work, a few things aren't perfect, for instance, you can't open each design in its own tab. But you can always do that later on MagicPath, or just ask in the Codex chat to share the link to the apps you just created or edited and that will work!

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Using Codex (or any other external agent) does NOT consume MagicPath credits. Free accounts have an API call limit, unlimited for Pro and Teams.

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Codex will also be aware when you select an image or a component in MagicPath for further edits!

JavaFXpert's profile picture
JavaFXpert4 months ago

Dude, that's pure magic.

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Let's gooo!

Arek Dvornechuck's profile picture
Arek Dvornechuck4 months ago

This is exactly what Figma should be shipping right now, what hell they are doing there???

Sandor's profile picture
Sandor4 months ago

little slow and rough around the edges but at first try it's wow

Pietro Schirano's profile picture
Pietro Schirano4 months ago

If you use fast mode or lower it, it gets much faster. :) You’re on extra high! Also, speed really depends on the codex. We catch every result in milliseconds. What’s crazy about this now tho, you can select any screen or a bunch and turn them into a iOS app lol

Sandor's profile picture
Sandor4 months ago

oh thanks man

Eren Suner's profile picture
Eren Suner4 months ago

the killer part isn't canvas inside codex. it's when the agent can carry the design intent across every later step without you re-explaining it.

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Design to code and back

JStar's profile picture
JStar4 months ago

@ajambrosino Can this be used to redesign desktop app ui?

Pietro Schirano's profile picture
Pietro Schirano4 months ago

@ajambrosino Yes!

Brad's profile picture
Brad4 months ago

Yeah this is how I run it. I hope OPENAI work more in the browser of codex so that you can open links and have multiple tabs and stuff

Lucas Dickey's profile picture
Lucas Dickey4 months ago

Huge, dude! This looks great. Fun to watch the evolution.

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Thank you!

Vuk.Digital's profile picture
Vuk.Digital4 months ago

Great stuff Will test it, had to do it manually, download code, throw it into codex or claude. Seems like a great lift

Adam Byrne's profile picture
Adam Byrne4 months ago

Yo… this canvas is inside Codex? 🤯

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Yep

Adam Byrne's profile picture
Adam Byrne4 months ago

Good God, that is amazing. How do i access the Magic Path within Paper? and will that integration make it into Codex as well?

Rehoboth Adam.'s profile picture
Rehoboth Adam.4 months ago

The gap between "I have an idea" and "I have a working app" just collapsed That's not a feature update That's a different world.

andres's profile picture
andres4 months ago

wait this is huge!

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Can’t wait for you to try it!

Joel Nevius's profile picture
Joel Nevius4 months ago

That is pretty dang cool

razi's profile picture
razi4 months ago

this is all we need. my biggest issue with @MagicPathAI was the lack of project context. this solves exactly that.

Pietro Schirano's profile picture
Pietro Schirano4 months ago

@MagicPathAI Btw, you can run any agents, Codex is the nicest, of course, because of the native browser. You can read more about how to use external agents in MagicPath here.

razi's profile picture
razi4 months ago

@MagicPathAI wow, it keeps getting better.

Nate Kohari's profile picture
Nate Kohari4 months ago

Huh. This is really interesting

Matt Rickard's profile picture
Matt Rickard4 months ago

i really like this design -- makes it super easy to work within codex and also graduate to the desktop app for deeper integration

Sanket's profile picture
Sanket4 months ago

One amazing future use case will be opening existing design of web app in magicpath and then redesigning it. Would be so handy.

Alex Prokhorov's profile picture
Alex Prokhorov4 months ago

This is truly impressive. Making me want to give codex another chance

WisGate's profile picture
WisGate4 months ago

The win is not skipping Figma. It is reducing translation loss. Teams should still define tokens, component ownership, review rules, and rollback. Otherwise "visual canvas to code" becomes a very fast way to generate very confident CSS debt. Follow us for agent workflow notes.

Juan Arreguin's profile picture
Juan Arreguin4 months ago

Yoooooo 🤌🏼✨

Pietro Schirano's profile picture
Pietro Schirano4 months ago

Unreal lmao

Juan Arreguin's profile picture
Juan Arreguin4 months ago

Dude I gotta try this! I was just going back and forth between Figma and Codex and Xcode and I was like there’s gotta be a better way! While updating @PanolsApp this week.

Pietro Schirano's profile picture
Pietro Schirano4 months ago

@PanolsApp This is perfect for that! Would love to hear your thoughts

Frank ✈️ (📜,📜)'s profile picture
Frank ✈️ (📜,📜)4 months ago

canvas inside codex is a huge workflow upgrade.

SMAmmar's profile picture
SMAmmar4 months ago

What about Claude :(

Pietro Schirano's profile picture
Pietro Schirano4 months ago

You can do it with Claude code, but Claude code doesn’t have a browser that can run other websites, can only run localhost. This is just a nicer experience, but you can have your Claude code app and MagicPath open at the same time!

Ash's profile picture
Ash4 months ago

Legend!

Elio's profile picture
Elio4 months ago

That's helpful.

arata's profile picture
arata4 months ago

tried MagicPath at aie workshop yesterday. one moment that felt magical was watching the generated content animated across the canvas. can't believe it's actually interactive, though tbf i haven't been exposed to ai design tools before, so maybe this is "normal"? idk

Pietro Schirano's profile picture
Pietro Schirano4 months ago

No, this is definitely not normal, ahah. In the canvas, we are the only ones that do that!

Michael Grinich's profile picture
Michael Grinich4 months ago

wild

Vladimir Gusev's profile picture
Vladimir Gusev4 months ago

Native canvas inside Codex is a big leap.

Peter Skøtt Pedersen's profile picture
Peter Skøtt Pedersen4 months ago

Very cool

Emanuel Perez's profile picture
Emanuel Perez4 months ago

Clean af

Roberto H Luna's profile picture
Roberto H Luna4 months ago

Omg

rea's profile picture
rea4 months ago

Playing around with this rn and it’s so helpful 🫪🫪🫪🫪🫪

Pietro Schirano's profile picture
Pietro Schirano4 months ago

I love it!

Adham🇱🇷's profile picture
Adham🇱🇷4 months ago

@victoria_framer This changes app development forever 👀

Gabe Ragland's profile picture
Gabe Ragland4 months ago

oh man this is smart

Related Videos