Shopify Hydrogen vs Liquid themes: when headless is worth it

Shopify Hydrogen vs Liquid themes is a choice between two ways to build a Shopify storefront: a Liquid theme, Shopify's conventional storefront edited in the theme editor and extended with apps, or Hydrogen, Shopify's toolkit for building a custom headless storefront in code. Hydrogen is worth it for brands whose theme has become the limit on speed, product experience or integrations, and who have, or will hire, a team to own the code after launch; for most other stores a well-built theme is the better answer.

This is written for the person making that call: a founder, a head of ecommerce or a marketing lead running a Shopify store on a theme who wants a straight answer rather than a pitch. The brands that should move are recognizable, and the second half of this article is a checklist for recognizing them.

What a Liquid theme is, and what it does well

A Liquid theme is a conventional Shopify storefront built with Shopify's Liquid templating and the theme editor; the alternative to Hydrogen. A theme is a set of layouts, templates, sections and blocks that Shopify renders on its own servers, so hosting, caching and the storefront runtime are Shopify's responsibility, not yours.

Modern themes, the architecture Shopify introduced as Online Store 2.0, use JSON templates that wrap sections. Merchants add, remove and reorder sections and blocks in the theme editor without touching code, and apps built as theme app extensions expose app blocks in the same editor.

That is the strength of the model. A theme gives you:

• A storefront a marketer can change on a Tuesday without a developer
• An app store of thousands of apps that install into the theme and show up in the editor
• Shopify's own search, customer accounts and sitemaps, included
• Platform features that arrive with Shopify's releases, without a rebuild
• A low fixed cost: no deploy pipeline, no code to maintain, no hosting decisions

People search for a "Hydrogen Shopify theme". There is no such thing, and the phrase points at the real confusion. Hydrogen is not a theme you install. It is a storefront you build.

What Shopify Hydrogen is, and what changed in 2026

Shopify Hydrogen is Shopify's React-based framework for building headless storefronts on top of Shopify's Storefront API; current versions are built on React Router (formerly Remix). That description fits the Hydrogen storefronts running today, including the ones 21phi builds and runs.

Shopify widened the definition in October 2026. Hydrogen 2026-10 is described by Shopify as a framework-agnostic JavaScript library that adds Shopify commerce to a JavaScript stack you already use: commerce primitives such as the cart, product data, Markets pricing and customer accounts, while your framework handles routing and rendering. Shopify Markets is Shopify's multi-market tooling for pricing, currency, language and domains per country.

Shopify ships starter templates for React Router and Next.js and documents earlier versions as Legacy Hydrogen with a migration guide. The React Router starter deploys to Oxygen: Shopify's global edge hosting for Hydrogen storefronts, included with Shopify plans; deploys from Git. The Next.js starter deploys to Vercel, so the framework you choose decides where the storefront can be hosted.

Two more terms matter. The Storefront API is Shopify's GraphQL API that a headless storefront uses to read products, collections, carts and customer data. The Customer Account API is Shopify's API and passwordless login for customer accounts in headless storefronts. Hydrogen covers the storefront side of these APIs and nothing else: checkout stays on Shopify, and the admin stays the admin.

Headless commerce vs traditional commerce

Headless (headless Shopify / headless commerce) means the storefront front end is decoupled from Shopify's back office and checkout and talks to Shopify through APIs; Shopify still runs products, orders, customers and checkout. Traditional commerce, on Shopify, means the theme: Shopify renders the front end as well.

The headless commerce vs traditional commerce debate is usually framed as old versus new. That framing is wrong. The Shopify Hydrogen vs Liquid question is about where the front end lives and who is responsible for it. Side by side, the two models split like this.

On a Liquid theme

• Shopify renders the page from your theme
• The storefront changes in the theme editor: sections, blocks, settings
• Apps install into the theme and appear in the editor
• Design freedom stays within the theme's sections and settings
• Performance is Shopify's, plus whatever the apps added
• Content outside products lives in theme sections, the blog and pages
• Checkout, admin, orders, products and customers are Shopify's

On Hydrogen

• Your code renders the page, on Oxygen or your own host
• The storefront changes in code: a commit, a preview, a deploy
• Apps are integrated through their APIs; theme app blocks do not apply
• Design freedom is anything the browser can render
• Performance is your team's responsibility
• Content outside products lives in a headless CMS alongside Shopify
• Checkout, admin, orders, products and customers are Shopify's, identical

Every "your code" or "your team" in the second list is a responsibility you take on. For the right brand that is control; for the wrong one, a bill.

Benefits of headless ecommerce, without the brochure

The benefits of headless ecommerce are real, and narrower than the pitch decks suggest. Here is what actually changes when a storefront moves to Hydrogen.

• The product experience stops being theme-shaped. Product systems, colorway logic, editorial layouts, scroll-driven launches: the storefront expresses the brand instead of fitting it into section settings.
• Performance becomes a design decision. A theme carries every installed app's scripts whether the page uses them or not. A Hydrogen storefront carries only what you wrote in.
• Integrations are built in, not bolted on. Reviews, chat, store credit, returns and sizing tools become part of the page, in the storefront's own design system, rather than widgets fighting the theme's CSS.
• Analytics gets cleaner. Pixels and events live in code, and the event taxonomy, the named set of tracked storefront events and their properties, is yours to define. Attribution, matching orders to the ad click or channel that drove them, depends on pixels, click IDs and server-side events surviving from storefront to checkout, and in code that path can be verified rather than inferred from a tag container.
• Content and commerce separate properly. Product data stays in Shopify and editorial content lives in a headless CMS. Sanity is a headless CMS 21phi uses for editorial and marketing content on its own site and on client storefronts; the split lets marketing publish without touching the catalog.
• Multi-market gets precise. Markets pricing, discount display and country selection behave the way the business decided rather than the way a theme assumed.

None of these are impossible on a theme. All of them are hard on a theme that has accumulated three years of apps.

What headless costs you, and it is not only money

Shopify's own headless documentation says plainly that a headless storefront costs more to build and run than a theme, and that the merchant should have developers to maintain the storefront after launch. Accept that before you read any agency's pitch, including ours.

• Someone has to own the code. Framework, package and Shopify API version upkeep do not stop. If nobody budgets for them, the storefront breaks slowly.
• Small edits have a deploy step. A theme change is live when you save. A Hydrogen change goes through a commit, a preview link on staging and a deploy. Safer, and slower for the one-line fix a founder wants right now.
• Apps need integrating. A one-click block on a theme becomes a small project: API, design, QA.
• Marketing loses the theme editor. Unless the build gives them a CMS and a design system to compose with, every landing page becomes a ticket.
• The talent pool is smaller. Hydrogen developers are rarer than theme developers, and the storefront is only as good as the people who stay with it.

When headless is worth it: six signals

Hydrogen is worth it when most of these are true.

1. The theme is the ceiling. You have a product experience in mind that no section, setting or app can produce, and you have tried.
2. Apps are fighting each other. Page speed, conflicting scripts and visual inconsistency are costing conversion, and removing apps is not an option.
3. You sell in more than one market with real pricing and display rules. Per-country pricing, discounts and messaging need to be exact.
4. Analytics and attribution are a growth lever, not a report. You run tests, read results by segment, and need events you can trust end to end.
5. You have, or will hire, a team that stays. In-house developers or an embedded agency who treat the storefront as a product, not a project.
6. You are on Shopify Plus or heading there. Shopify Plus is Shopify's enterprise plan with higher limits, checkout extensibility, Shopify Functions, B2B and Markets features, and a custom storefront is where those features pay off twice.

When a Liquid theme is the better answer

Stay on a theme, and spend the difference on product, creative and ads, when:

• The catalog is simple and a well-built theme already presents it well
• The team has no developer and no plan to keep one
• Speed to launch matters more than control over every pixel
• The apps you use are good and play well together
• "Headless" is on the roadmap because a competitor did it, not because a customer asked for something the theme cannot do

A good theme, kept clean, beats a neglected headless build every time.

What stays the same either way: checkout, admin, Shopify

Headless does not mean headless checkout. On both a Liquid theme and a Hydrogen storefront, checkout is Shopify's: the same hosted pages, the same Shop Pay, the same rules.

Customization happens through checkout extensions: Shopify's supported way to customise checkout (UI extensions, branding API, Shopify Functions) without editing checkout.liquid; checkout itself stays Shopify-hosted. Shopify has deprecated checkout.liquid. Shopify Functions are server-side custom logic Shopify runs at checkout and in the cart (discounts, cart transform, delivery and payment customisation). UI extensions for the information, shipping and payment steps are available only on Shopify Plus; that is a plan question, not a storefront question, and it is the same on a theme and on Hydrogen.

The admin, orders, inventory, customers, discounts and Markets are identical too. Hydrogen changes the front of the store. It does not change the store.

How to decide: questions to ask before you choose

Take these into the conversation with any agency, including 21phi.

1. What exactly can our theme not do today? Write the list. If it is short and vague, stay.
2. Which apps do we depend on, and how would each one exist on a headless storefront?
3. Who owns the code a year after launch, and is that budgeted?
4. How will marketing publish a landing page without a developer?
5. What happens to our URLs, structured data and rankings during the migration?
6. What does the deploy process look like for a one-line fix?
7. What is the plan for analytics and attribution from day one?
8. If we stay on a theme, what would it take to make the theme great instead?

An honest partner answers the last question seriously. If they will not, that tells you about the partner, not about headless.

Where 21phi stands

21phi is a Shopify Hydrogen agency with Shopify Plus experience, based in Toronto and working with brands across North America. We have the Shopify Hydrogen vs Liquid conversation on the first call, including the times a theme would serve a brand better, because the storefronts we run have taught us where the cost of headless lands: after launch. This costs more than a body shop, and it should. A body shop prices tasks and forgets your store between tickets, and headless punishes that model because every ticket starts with relearning the codebase.

Our answer to that cost is how we work. An embedded team is 21phi's engagement model after launch: the agency works inside the client's channels and roadmap as the storefront, analytics and growth team, on a monthly retainer scoped per client. We sit in the client's own group chats for web, customer care and the wider team, and requests from every department land with us: a final-sale label from customer care, an account page speed check from logistics, multi-market pricing display from operations, a landing page for a drop from marketing, a navigation change from the founder.

Urgent fixes go to the front of the queue, third-party apps are integrated into the storefront rather than bolted on and we chase the vendor when one misbehaves, and framework, package and Shopify API version upkeep is a standing monthly item rather than an emergency. An embedded team carries the context, which is what makes the deploy step fast, the launches calm and the storefront better each month instead of slowly broken, and a named senior person is on the other end, not a ticket queue.

Next step

If the signals above describe your store, read how we build on Shopify Hydrogen development and what a move from a Liquid theme involves on Shopify migration services. Two storefronts show the result: AsWeMove, a Liquid theme replaced by a Hydrogen storefront that we continue to run, and Kayusha, a Shopify Hydrogen storefront 21phi designed and built for Kayusha, a premium pet-carrier brand. Then tell us about your store. Every project is scoped individually; we come back with questions, not a template.