What is Storesynk?

Storesynk turns plain HTML into a live Shopify storefront. You write tags like <storesynk-product>, <show-price>, and <add-to-cart>; the engine fills them from your store’s Storefront API and wires up the cart. No component framework, no build step, no theme.

<script type="module" src="https://cdn.storesynk.io/elements/0.1/storesynk.js"></script>

<storesynk-store domain="your-store.myshopify.com" token="your-public-storefront-token">
  <storesynk-product handle="your-product-handle">
    <h1><show-title></show-title></h1>
    <show-price></show-price>
    <add-to-cart><button type="button">Add to cart</button></add-to-cart>
  </storesynk-product>
</storesynk-store>

Two halves

• The engine is the free, open @storesynk/* packages and the CDN bundle. It renders products, collections, search, cart, customer accounts, Markets pickers, and client-side pixels from your markup. It works anywhere HTML does: a static file, Astro, Next.js, Remix, or TanStack Start.
• The Storesynk AI Shopify app adds merchandising on top: bundles, mix & match, product add-ons, volume discounts, customer pricing, page gates, server-side analytics, and the MCP server for AI tools. You configure an offer in the app; the same engine tags render it. Widgets that read app data stay hidden until the app is installed. See all features.

Built to be built by AI

The tag vocabulary is small and declarative, so an AI tool composes a storefront the way it writes HTML. The Storesynk MCP server gives Claude, Cursor, and Lovable your real products, a markup validator, and the maintained playbook. Writing the tags yourself uses the same vocabulary.

Where to go

1. Build with AI: connect a tool and describe your store.
2. Try it in 2 minutes: one copy-paste file.
3. Connect your store and set up your project.
4. Core concepts, then the guides and features.

Next: Build with AI