My Workflow for Iterating on Website Design in Cursor (with Magicpath)

👉 Try MagicPath for free: https://www.magicpath.ai 🛠️ Get Cursor (use my link get 50% off first month on all plans) — https://cursor.com/referral?code=MTHG... Cursor is incredible for building websites with AI—but sometimes you want more creative control over the design. In this video, I'll show you a workflow that combines Cursor and MagicPath AI to get the best of both worlds. We'll take an existing Cursor project, import it into MagicPath, make visual design updates using AI, sync those changes back into the codebase, push everything to GitHub, and deploy the updated version to a live website. If you're building websites with AI and want a faster way to iterate on your designs without manually rewriting code, this workflow is definitely worth trying. Whether you're a web designer, developer, freelancer, or vibe coder, this workflow gives you a faster way to iterate on both design and code. 💌 Join my newsletter: https://sergeichyrkov.com/newsletter 🎙️ Want to learn more? Book 1:1 session: https://sergeichyrkov.com/learn ______________________________ Connect and Follow me ⬇️ ▸ My website — https://sergeichyrkov.com ▸ My studio — https://chyrkov.studio ▸ My curated resources library — https://designsweets.co ▸ Twitter —   / sergeichyrkov   ▸ Instagram —   / chyrkov   ▸ Behance — https://www.behance.net/chyrkov ▸ Linkedin —   / sergeichyrkov   ______________________________ Useful stuff: 👉 Build websites in minutes with Framer — https://framer.link/chyrkov 👉 Record your screen like a Pro — https://screenstudio.lemonsqueezy.com... 👉 Best music for your videos (get 30 days for free) — https://www.epidemicsound.com/referra... 👉 Cursor (get 50% off first month on all plans) — https://cursor.com/referral?code=MTHG... ______________________________ 📝 Chapters: 0:00 — introduction 0:38 – What is MagicPath is (MagicPath 2.0, multi-agent canvas feature) 1:43 – Installing the MagicPath skill in Cursor 4:17 – Connecting the agent, Transferring the Next.js landing page into MagicPath (the "zero tokens" trick) 6:58 – Reviewing the imported design (font issue, comparing to the live Vercel site) 8:19 – Editing typography and design elements directly in MagicPath 9:00 – Creating new layout versions/variants 9:28 – Adding reveal animations to the H1 heading using the MagicPath skill 10:12 — Preview new home screen designs 11:25 – More visual tweaks: button color, borders, background, matching colors across elements 12:48 – Syncing the new design back into Cursor (creating a new branch, updating components) 13:36 – Reviewing the branch, pushing to GitHub 14:20 – Merging to main and auto-deploying via Vercel 14:55 — Final review of the live website ______________________________ 😍 Monetarily Supporting The Channel: If you like what I do and wish to support the channel monetarily, you can donate me with some coffee here: https://www.buymeacoffee.com/sergeich... This is appreciated and helps the channel, but please don't feel that it is necessary to enjoy my content. ______________________________ 📃 Disclaimer: Some of the links in my video descriptions are affiliate links, which means at no extra cost to you, I will make a small commission if you click them and make a qualifying purchase. ______________________________ #Magicpath #Cursor #AI #WebDesign #VibeCoding