Figma to Shopify with Instant

Figma to Shopify with InstantBuild responsive Shopify pages and sections 10X faster with the Figma to Shopify plugin by Instant. Copy and paste any Figma frame to Instant and publish to your Shopify store in seconds without code.

How it worksConnect, Create your Instant account at https://app.instant.so/register and connect your Shopify store to your Instant project.

Copy & Paste, Design Pages or Sections in Figma and use the plugin to copy the designs, then paste it into Instant.

Publish, Connect eCommerce data and actions from your Shopify store in the Instant Builder and publish your designs as Pages or Sections to your Shopify theme with one click!

Video tutorialWatch on YouTube: Figma to shopify with AISupportIf you have any questions, issues, or suggestions, please reach out to support@instant.so.

Design with Auto layoutUse auto layout as much as possible for the best result. This will automatically convert all layers to responsive web elements, making publishing your designs to Shopify even easier. If done correctly, you only need to add your finishing touches in the Instant Page Builder to make your layouts fully responsive on all devices.

Figma Starter KitWe've released a free Figma UI Kit consisting of eCommerce sections designed with Auto layout, you can use the UI Kit as a starting point for your next project: Landing Page Starter KitAdditional resourcesFigma Auto layout tutorialsExplore Auto layout propertiesPublish to Shopify with easeThis plugin makes it easy to turn your Figma designs into Shopify sections and pages. When you're ready to publish with Instant, we ensure your webshop is built using best practices; that way, it loads quickly across all devices.

Your design mockups are converted in Instant into native Liquid, CSS, and JavaScript code. And, we optimize for performance by minifying all the JavaScript and image files and serving assets from the Shopify CDN.