How Much Does Shopify Headless Cost? The Five Invoices Nobody Warns You About

Shopify headless costs between $30,000 and $300,000+ to build, depending on the stack and scope. That number is real, but it is only one of five separate invoices that land over the life of the project. Most proposals show you the first one and hide the rest.

Key takeaways

• Build cost alone runs $30K, $300K+; the ongoing engineering retainer often costs more over 24 months than the build itself.
• Shopify's Oxygen hosting is free on paid plans, but running on Vercel adds $20, $1,500/month; neither figure is the expensive part.
• A headless CMS (Sanity, Contentful, Storyblok) adds $99, $1,500/month in recurring platform fees most scoping documents omit.
• Most of the Shopify App Store's 13,000+ apps are built for Liquid themes and do not work out of the box in a headless setup, adding custom integration cost.
• Stores under $2M annual revenue almost always get better ROI from a performance-optimized Liquid theme than from a headless build.

What "going headless" actually means (and why it costs what it does)

In a standard Shopify store, the Liquid theme and the Shopify backend are tightly coupled. The theme renders pages directly from Shopify's data. In a headless setup, the frontend is completely replaced by a custom application, typically built on Shopify's own Hydrogen framework or on Next.js via the Storefront API. Shopify becomes a pure commerce backend: products, inventory, checkout, and orders all stay there, but everything the customer sees is rendered by your custom code.

That decoupling is precisely what makes headless expensive. You are no longer renting Shopify's frontend infrastructure. You own it, which means you pay to build it, host it (optionally), maintain it, and update it as Shopify's APIs evolve.

Invoice 1: The build

This is the number every agency leads with, and even here the range is wide.

• Hydrogen + Oxygen (Shopify-native path): $30,000, $100,000+ for a production-ready storefront. This is the most cost-efficient headless path in 2026 because Shopify built Hydrogen and Oxygen specifically to reduce infrastructure overhead.
• Next.js + Storefront API: $40,000, $150,000+, sometimes significantly more, because the team owns more of the application architecture.
• Full composable commerce (multi-market, B2B, Storyblok integration, custom UX): $100,000, $300,000+, and enterprise agencies in Europe regularly quote in the €100K, €250K range for that scope.

The build timeline is 3-6 months for a competent team. That alone tells you this is not a "quick launch" decision.

What moves the build price:

• Number of templates and page types (PDP, PLP, editorial, B2B portal, landing pages)
• Whether you need a headless CMS integrated (see Invoice 3)
• Multi-market or multi-language requirements
• Custom product configurators or non-standard UX flows
• SEO migration complexity (redirects, structured data, metadata, hreflang)
• QA, accessibility audit, and post-launch support hours in scope

A proposal that does not specify those line items is not a proposal. It is a guess with a price attached.

Invoice 2: Hosting

This one is mostly noise, but agencies sometimes inflate it.

Shopify's own Oxygen hosting is free on any paid Shopify plan, including development stores and Plus. If you deploy on Vercel (and on June 30, 2026, Shopify officially announced that Hydrogen now deploys to Vercel in one click), pricing runs approximately $20, $500/month for most stores and $400, $1,500/month for high-traffic builds. Cloudflare Pages and AWS are also viable, but they add DevOps overhead that costs engineer hours.

The blunt summary: hosting is a rounding error. A $500/month Vercel bill on a store doing $5M/year is irrelevant. If a proposal is spending a lot of words on hosting optimization, ask instead where the engineering retainer line item is.

Invoice 3: The headless CMS (the one most merchants forget)

This is the single most common operational regret from merchants who go headless: they launch and discover that every content change, every banner update, every promotional landing page requires a developer deploy because nobody budgeted for a content management layer.

A headless CMS sits between your editorial team and your Hydrogen storefront and lets non-developers update content without touching code. The main options and their 2026 costs:

Most mid-market brands land on a plan in the $99, $300/month range. Enterprise setups with multiple editors and high API volume can reach $1,500/month or more. Neither number is individually alarming, but they are recurring costs that compound over 12-24 months and are routinely missing from the initial proposal.

The practical question to ask your agency before signing: "Who updates the homepage banner on a Tuesday when you are not on retainer?"

Invoice 4: The app compatibility tax

The Shopify App Store has over 13,000 apps. The vast majority are built to inject Liquid snippets or App Blocks into traditional Shopify themes. In a headless setup, most apps either do not work, require significant custom integration work, or provide degraded functionality.

This matters immediately if your current stack includes any of the following:

• Reviews and UGC tools (Okendo, Yotpo, Junip)
• Loyalty programs (LoyaltyLion, Smile.io)
• Smart cart or upsell apps (Rebuy, CartHook)
• Email capture pop-ups and on-site overlays
• Subscription billing (Recharge, Stay.ai)

Each integration that does not have a supported headless SDK becomes a custom build. Budget $2,000, $10,000 per integration that needs to be rebuilt, and expect some vendors to tell you their headless support is "coming soon" (which in practice means it is not available now).

Before you approve a headless build, audit every app in your current stack against the vendor's headless compatibility documentation. That audit should be part of the scoping work, not an afterthought.

Invoice 5: Ongoing engineering

This is where the real long-term cost lives, and it is the figure most proposals bury in an asterisk.

A Liquid theme on Shopify Online Store 2.0 can be maintained by a solo developer on a small retainer, or even by a technically capable merchant using the theme editor. A Hydrogen storefront cannot. You own a React application that must be updated as Shopify evolves its Storefront API, as Hydrogen's dependencies change (it moved from Remix to React Router in 2025-2026), and as your own feature roadmap grows.

The market rates for ongoing headless maintenance in 2026:

• Light retainer (bug fixes, minor updates): $2,000, $4,000/month
• Active development retainer (new features, CMS work, integrations): $4,000, $8,000/month
• Dedicated frontend team (agency or in-house): $8,000, $40,000/month

Over 24 months, the retainer alone adds $48,000, $96,000 at even the conservative end. That is on top of the build. A traditional Shopify theme development project at $15,000, $40,000 with a $1,000, $2,000/month light maintenance retainer looks meaningfully different in a side-by-side total cost model.

The honest comparison table

Note: a poorly built Hydrogen store will underperform an optimized Liquid theme. The framework does not guarantee performance. The engineering does.

Who should actually go headless

The revenue thresholds cited across the industry in 2026 are consistent: headless makes economic sense at roughly $2M, $5M+ annual GMV, and only when you have a specific, measurable constraint that a Liquid theme cannot solve.

Go headless if:

• You sell across three or more distribution surfaces (web, mobile app, kiosk, B2B portal) that need a single API-driven backend.
• You have editorial commerce with a genuine content team that publishes at high velocity and needs content and commerce unified in rendering.
• You have measured, documented performance bottlenecks that a Shopify speed optimization pass has not resolved.
• You have a custom product discovery or configurator UX that Liquid templates structurally cannot support.

Stay on a Liquid theme if:

• You are under $2M annual revenue and your team does not include a dedicated React developer.
• Your marketing team updates content regularly and needs to do so without developer involvement.
• You rely on plug-and-play apps like Klaviyo email capture, review widgets, or subscription tools.
• You have launched in the last 18 months and have not yet run a proper Core Web Vitals and conversion audit.

As one recent analysis put it, many brands can close 70% of the performance gap at 10% of the cost by optimizing the Liquid theme first. That optimization should be your first move before any headless conversation.

A note on Hydrogen's June 2026 Vercel integration

In late June 2026, Shopify announced that Hydrogen now deploys to Vercel via a one-click button that scaffolds a working storefront with the Storefront API client, cart, and product and collection pages pre-wired. This lowered the friction to start a headless experiment. It did not lower the cost to build and maintain a production store. If you saw that announcement and thought "this makes headless affordable now," re-read Invoice 5 above.

What a fair scope looks like

Before you sign a headless proposal, the document should explicitly answer:

1. How many templates and page types are included?
2. Is CMS integration in scope? Which platform, at what tier?
3. Which third-party apps have been confirmed headless-compatible, and which require custom work?
4. What does the SEO migration plan look like (redirects, structured data, hreflang if relevant)?
5. What is the post-launch support and retainer arrangement?
6. Who owns the repo, and what documentation is delivered at handoff?

If the answer to any of those is "we will figure that out later," the price will go up. That is not cynicism; that is how software projects work.

I have delivered 65+ Shopify builds over six years, including both optimized Liquid themes running at 95+ Core Web Vitals and full headless builds for Shopify Plus merchants with genuine multi-surface requirements. The pattern I see most often is merchants who were sold headless as an upgrade when a hardened Liquid theme was the right tool for their stage. The second most common pattern is merchants who needed headless but received a proposal that underpriced the ongoing engineering by a factor of two or three.

Both are expensive mistakes. The checklist above is designed to help you avoid them.

If you are scoping a headless build or weighing it against a high-performance Liquid theme, talk to me first. I will give you an honest read on which path fits your store, your team, and your budget.