Headless Shopify: What It Costs and When It Pays Off

An agency proposal that says "go headless" usually promises speed, design freedom and a modern stack. What it rarely lists is what the store stops getting for free: the theme editor your team uses, the way apps plug into a theme, the sitemap and canonical tags Shopify writes for you, and a maintenance bill that never ends.

This guide is written for the merchant who signs that proposal. It covers what headless means on Shopify, what each piece costs, what you give up and when it pays off, with every Shopify fact taken from Shopify's own documentation as of October 2026, and every outside price labelled with who published it.

What Headless Shopify Actually Means

A standard Shopify store renders every page through a theme written in Liquid, Shopify's template language. A headless store drops that layer: the pages customers see are built in another framework and hosted wherever your developers choose, and they ask Shopify for products, prices and the cart through an API.

Shopify's Help Center spells out what that replaces. On a custom storefront, you replace the Online Store channel and Liquid themes with a storefront built in the languages and tools you prefer, and customers browse, add to cart and then check out using the Shopify Checkout. It is a replacement for the theme, not an add-on to it.

Hydrogen Was Rebuilt in October 2026

Hydrogen is Shopify's own toolkit for headless storefronts. Through version 2026-04 it was a full-stack framework built on Remix or React Router, with its own components, project structure and command-line workflow. Starting with version 2026-10, it is a toolkit you add to your framework instead.

For a merchant the change is practical: your agency no longer has to build the whole site on Shopify's framework to use Shopify's cart and analytics logic, and it can start from a React Router or Next.js template. Shopify's release notes put it in one line.

If you already run a Hydrogen storefront, nothing breaks today. Shopify's legacy Hydrogen documentation recommends migrating to the latest version, but none of the pages we read in October 2026 sets an end-of-support date for the older versions (see the box under the build estimates).

The Pieces: Channels, APIs, Hydrogen and Oxygen

Agency proposals mix these names freely, so it helps to know which piece does what. The two APIs carry the data, the two channels hand out access to them, Hydrogen saves your developers from writing Shopify-specific logic, and Oxygen is one hosting option among several.

Where It Lives in Your Admin

Shopify's headless overview says you get Storefront API and Customer Account API access through a sales channel in the Shopify admin, and offers two. The Headless channel is for a storefront you host yourself, on any stack. In it you can create multiple storefronts, each with its own public and private Storefront API tokens, while all of them share the same API permissions. Shopify's pricing page and its Headless channel docs give different storefront counts; the plan section below compares them.

In Shopify admin

1. Sales channels
2. Headless
3. your storefront
4. Storefront API

Zoom

The Hydrogen channel is for a storefront you build with Hydrogen and deploy to Oxygen, Shopify's hosting for Hydrogen storefronts. A Hydrogen storefront deployed somewhere else, such as Vercel, goes through the Headless channel instead. And if you only want to show products on a site you already have, Shopify's docs say you can skip the Headless channel and use Storefront Web Components, unless you need to show inventory counts or custom product data.

In Shopify admin

1. Sales channels
2. Hydrogen

Zoom

Five Ways to Build on Shopify's APIs

Not every route that uses Shopify's APIs means rebuilding your store. Two of the five add commerce to a site you keep, and the mobile route can leave your web store exactly as it is.

One limit decides the framework for a full storefront: Hydrogen works with frameworks that run server code, such as Next.js, React Router, Nuxt, Astro and SvelteKit. Apps that run only in the browser, or that build only static output, don't work with it.

Oxygen or Your Own Host

Shopify's docs say your framework determines where you can deploy a Hydrogen storefront, with Oxygen, Vercel, Node, Cloudflare and Deno among the targets. Shopify maintains the React Router template, which deploys to Oxygen; Vercel maintains its Next.js template, Vercel Shop.

Shopify's enterprise guide says Oxygen hosting is subject to runtime and usage limits, without naming traffic numbers.

What Headless Shopify Costs

Shopify doesn't put a number on a headless build anywhere we looked, but it is direct about the direction. Its developer documentation states the trade-off before it describes a single API.

What Shopify Charges by Plan

Three different counts appear in Shopify's materials, and they are easy to confuse. The plan comparison on Shopify's pricing page lists headless storefronts: 1 on Basic, Grow and Advanced, and 25 on Plus. The tooltip on that row describes building with Hydrogen and deploying on Oxygen, while Shopify's Headless channel docs allow up to 100 active storefronts and access tokens per shop without naming a plan. The Shopify pages we read in October 2026 don't reconcile the two storefront counts, so ask Shopify which limit applies to your build.

Separately, Shopify's Oxygen docs set how many public environments a store can have, which is what lets anyone with the URL see that environment without logging in to your store.

Oxygen itself is listed as available at no extra charge on paid Shopify plans, on development stores, Plus Partner Sandbox stores and trial plans, so a storefront can be built and tested before the store goes live. That plan list sits on a page in Shopify's Legacy section, which also says Oxygen isn't available on the Agentic plan. If you are weighing Plus mainly for its 25 headless storefronts on the pricing page or its 25 public Oxygen environments, our guide to what Plus costs over three years puts the price side by side with what else it adds.

What the Build Costs: Third-Party Estimates

The four estimates below are what we found published or last updated in 2026, read on October 26, 2026. Weaverse sells a visual editor built for Hydrogen and Hydrogen builds, Fudge sells an AI storefront editor that, in its own words, competes for the same budget a headless build would consume, and the two agencies sell headless builds, so each has a commercial interest in the answer. They also measure different scopes in three currencies: read each row on its own terms and don't average them.

Two cautions apply to the agency rows. Both were published or last updated before June 17, 2026, when Shopify announced an early developer preview of the framework-agnostic Hydrogen, so they describe the earlier Hydrogen, a React framework built on React Router, not the framework-agnostic version. And the Ask Phill article describes Oxygen as having unlimited bandwidth, while Shopify's own guide says Oxygen hosting is subject to runtime and usage limits, so take its figures with care.

For comparison, what a store built on a theme costs, from a self-built setup to an agency project, is laid out in our Shopify development cost scenarios.

The Bill That Keeps Coming: Maintenance

Shopify's enterprise guide to headless commerce splits the budget into separate lines:

• development of the storefront itself;
• integrations with the apps and systems the store already uses;
• ongoing maintenance after launch;
• a headless CMS subscription, if content lives there;
• paid apps;
• external hosting, if the storefront isn't on Oxygen.

The maintenance line is the one proposals understate. Fudge, which sells an AI storefront editor, describes it as dependency upgrades, quarterly API version bumps and framework migrations that need permanent engineering ownership a Liquid theme doesn't. Charle, the UK agency in the table above, ties that upkeep to how fast you ship changes.

What You Give Up Versus a Liquid Theme

Most of what a merchant loses in a headless move isn't a feature Shopify takes away. It is work a theme was doing silently that now has to be rebuilt, connected or owned by someone. The table pairs each one with what replaces it.

The Theme Editor and Your Apps

Shopify describes the theme editor as the tool that lets merchants customize their store's content and appearance and preview changes in real time, on a theme. Its enterprise guide puts the contrast plainly: on a traditional storefront, built-in editors let merchants update supported content and layouts; on headless, editing options depend on the CMS or storefront tools selected.

Third-party apps fill part of the gap. The App Store's apps to extend a Hydrogen build collection includes Weaverse, which offers visual editing for Hydrogen stores, as of October 2026.

Apps are the second thing to check. Theme app extensions integrate with Online Store 2.0 themes, show up in the theme editor, and give apps two ways into a theme: app blocks and app embed blocks. Every new App Store app that integrates with a theme must use them.

On Hydrogen, Shopify's docs say installed apps and shopping agents that use the standard cart contract read and update the cart the same way they do on a theme, and Hydrogen serves the AJAX cart URLs that theme apps call.

For everything else, Shopify's guide tells merchants to verify how subscriptions, reviews, loyalty programs and analytics will work, and to ask their partner which existing apps need custom integration or replacement. The App Store's custom storefront apps collection is a starting point for that conversation, not a guarantee: it is a curated list that changes.

SEO, Sitemaps and URLs

On a theme, Shopify's SEO overview says your sitemap.xml and robots.txt files are generated automatically, and canonical tags are added to pages to keep duplicate content out of search results. Which of those a headless build has to recreate is easier to see once you know what Shopify handles for SEO on its own. On Hydrogen 2026-10 the picture changes in four places:

• Sitemap and SEO helpers are gone. Hydrogen 2026-10 drops the sitemap and SEO helpers that older versions had.
• Tags are your framework's job. Meta tags, Open Graph tags and structured data are rendered with your framework's head or metadata API.
• Redirects survive. If your router can't find a page, Hydrogen checks the store's URL redirects before the customer gets a 404.
• Some URLs differ. The standard product URL is /products/:handle, and the Online Store's "all" collection doesn't exist in the Storefront API, so link to it only if your store has a collection with that handle.

Analytics, Consent and Search

Shopify's Hydrogen analytics docs say it sends the same events that Liquid themes send and respects each visitor's privacy choices. Your app decides when to publish those events, because only your routes know when a product or collection is on screen, and without the Storefront API proxy, analytics and checkout session continuity are incomplete.

Consent is the second piece. Shopify's Customer Privacy API docs point custom storefronts to Hydrogen's analytics and consent setup, which they call the only way to fully integrate the cookie banner with Shopify Analytics; Hydrogen's ShopifyScripts loads the Customer Privacy API for you, with Shopify's hosted banner or a third-party one.

Search carries over, with setup. Shopify's storefront search guide says a custom or headless storefront can use the Search & Discovery app's features through the Storefront API, and its developer docs add that AI-powered search needs search tracking set up on the custom storefront. How boosts, filters and synonyms work on a theme is covered in our Search & Discovery guide.

Cart, Customer Accounts and Markets

Per Hydrogen's customer accounts docs, Hydrogen provides the Customer Account API client, OAuth route handlers and session helpers, while your app owns the session storage and the account UI. Shopify's Customer Account API docs add that its hosted sign-in gives customers passwordless login and a single sign-on across custom storefronts, the online store, accounts and checkout.

One precondition is easy to miss: Shopify's customer accounts are required to use the Customer Account API. If your store still runs the older account system, read our guide to the customer accounts migration before the headless build is scoped.

International selling moves into code too. Shopify's Hydrogen markets docs say a headless storefront decides which market each request belongs to and then asks the Storefront API for data in that market's context. Without that context, the API returns the products published for the primary market, priced in the shop's currency. How markets, currencies and domains work on the Shopify side is the subject of our Shopify Markets guide.

When Headless Pays Off, and When It Doesn't

Shopify sells both routes, so its own line between them is the most useful starting point. Its developer documentation frames headless as the answer to one specific gap.

Shopify's Own Cases for Going Headless

Shopify's developer documentation lists five situations where building headless makes sense:

• You're building a storefront experience that existing web or mobile tools can't support, or can't support easily.
• You have a web frontend stack that doesn't use Liquid.
• You want to add Shopify commerce to infrastructure that you already have.
• You sell on several channels that Shopify doesn't support out of the box.
• You use a CMS, or plan to, for content that's integrated with your storefront.

Shopify's enterprise guide adds the business conditions: consider headless when your shopping experience needs interactions a theme can't reasonably deliver, when your developers need independent control over storefront technology and releases, when you need custom interfaces for apps, kiosks or other sales channels, and when your budget covers ongoing development, testing and maintenance. The last condition is the one most proposals leave out.

When to Keep the Theme

Fixable speed problems are where many headless pitches start. Before a slow store becomes a rebuild, find out where the time actually goes: images, apps and theme code are fixed on the theme you have.

If you stay, start from a current theme. Horizon is Shopify's flagship theme, and our Horizon theme guide covers what it changes and what moving to it involves.

One Brand's Migration, in Their Own Words

The interview below is one team's account, published by Shopify in February 2024, when Hydrogen was still Shopify's own framework. Its chapters cover an incremental adoption, the checkout, subscriptions and integrating custom software, which are the same decisions this guide's checklist asks you to settle. Treat any results mentioned in it as ButcherBox's experience, not as evidence for your store; the figures and limits on this page come from Shopify's current documentation.

The Middle Paths: Hybrid and Embedded Commerce

Shopify's enterprise guide states that on Shopify, retailers can use a mix of headless and traditional. For a merchant that usually means keeping the Liquid theme for the main store and building only the part that needs it, such as a native app on the Storefront API, on its own.

The embedded paths are for a site that isn't your Shopify store. Shopify's Help Center doesn't recommend buy buttons on your Shopify online store or blog, because they can cause problems with checkout. If the site you keep is the starting point, our guide to adding Shopify to an existing website compares the embedding methods step by step, while Buy Button JS is the developer library behind customizable embeds; it runs on the JS Buy SDK, which Shopify deprecated in January 2025 and won't maintain after version 3.0.

Headless, Hybrid or Theme? Find Your Route

The verdict table at the top answers by a single profile. This answers by combination: what is pushing you toward headless, where you sell, who maintains the storefront, how your team edits pages and what the budget covers.

Some answers decide the route on their own: an existing non-Shopify site; no one to look after the storefront; a tight deadline or budget; selling in a native app, a kiosk or a channel Shopify doesn't support out of the box; or a speed problem. When two of them apply, the one earlier in this list wins.

Before You Sign: A Scoping Checklist

Work through the steps in order with the proposal open. Step one decides whether the rest is worth doing, and steps two and five carry the most risk for a store that already has apps and search traffic. On the hybrid route, apply the steps to the headless piece only. If your result was the theme or an embed, keep the list for the day an agency quotes headless anyway.

Shopify's guide points to its Partner Directory for agencies and developers that can set up and operate a headless architecture. How to brief, vet and hire one is covered in our guide to hiring a Shopify developer.

Not sure yet which kind of specialist you need? Our Shopify development hub routes you to the right guide in about a minute.

The Bottom Line

The real cost is a storefront your team owns for its whole life, and the jobs a theme was doing for free.

Frequently Asked Questions