Guide · 10 min read · Updated May 2026

What is Headless Shopify? Complete 2026 Guide with INR Costs

TL;DR

Headless Shopify means building your storefront as a separate front-end app (usually Next.js or Hydrogen) that consumes Shopify's Storefront API, while Shopify keeps running checkout, payments, and inventory. You gain speed and design freedom; you lose the theme editor and many app integrations. Indian D2C brands typically pay ₹2-5 lakh for a headless build and need ₹2cr+ revenue to justify the engineering overhead.

Definition

Headless Shopify is an e-commerce architecture in which the storefront (the customer-facing UI) is completely decoupled from Shopify's default theme layer. Instead of a Liquid theme rendered by Shopify's servers, you build the storefront as a standalone application — typically Next.js, Remix, or Shopify's own Hydrogen framework — that fetches data from Shopify via the Storefront API (GraphQL) and the Cart API.

Shopify still runs everything behind the scenes: products, inventory, orders, the checkout flow, payments via Razorpay/Stripe/Shop Pay, taxes, and shipping. You are not leaving Shopify — you are replacing only the presentation layer with code you control.

Traditional vs headless Shopify architecture

Traditional Shopify
  • · Liquid theme rendered by Shopify servers
  • · Theme editor + sections drag-and-drop
  • · App marketplace works out of the box
  • · Single domain handles everything
  • · Limited customisation beyond theme spec
Headless Shopify
  • · Next.js / Hydrogen front-end on Vercel or Oxygen
  • · Storefront API + Cart API for data
  • · Total freedom over UI / UX / routing
  • · Edge caching = faster Core Web Vitals
  • · Theme-injected apps must be reimplemented

When headless makes sense

  • Your Core Web Vitals are stuck below LCP < 2.5s on mobile despite theme optimisation.
  • You have a content-heavy site (long-form blog, editorial, lookbooks) where Shopify's blog engine feels limiting.
  • You need custom PDP logic (configurators, made-to-order, B2B portals) that themes cannot cleanly support.
  • You run omnichannel — same product catalogue feeding a kiosk, a mobile app, and the web.
  • You have in-house engineering or a long-term agency partner who can own the codebase.

What you gain

  • · Performance. Edge-rendered React with ISR / RSC frequently posts Lighthouse 95+ where Liquid themes plateau at 60-75.
  • · Design freedom. No theme-spec constraints. Any animation, any layout, any routing pattern.
  • · SEO control. Full Next.js metadata API, custom schema, server-rendered structured data.
  • · Omnichannel. The same Storefront API powers your web, app, kiosk, and PoS.
  • · Modern DX. TypeScript, components, version control, CI/CD, preview deployments.

What you lose

  • · Theme editor. Non-technical content edits now require either a CMS layer (Sanity, Hygraph, Shopify metaobjects) or a dev.
  • · App marketplace. Theme-injected apps (Judge.me widgets, popups, upsell modals, sticky cart bars) need to be rebuilt.
  • · Time-to-launch. A new feature that took 2 hours on a theme now takes a dev sprint.
  • · Cost predictability. Hosting, monitoring, error tracking, and dev maintenance become recurring line items.

Tech stacks for headless Shopify

Next.js + Storefront API— the most flexible stack. Deploy on Vercel or Netlify. Most Indian agencies (including us) default to this for projects that need long-term flexibility.
Hydrogen + Oxygen— Shopify's opinionated React framework (Remix-based) deployed on their edge platform. Faster to start, tighter integration, less flexibility outside Shopify's ecosystem.
Nuxt / SvelteKit / Astro— valid if your team has Vue / Svelte preference. Less community tooling for Shopify specifically.

Costs in INR (2026 reality)

Headless build (5-8 templates, Next.js)
₹2-3.5L · 8-12 wks
Headless build with custom logic (configurator, bundles, B2B)
₹3.5-6L · 12-20 wks
Hydrogen + Oxygen build
₹2-4L · 6-10 wks
Vercel / Netlify hosting
₹2-12K/mo · scales with traffic
Ongoing maintenance
₹15-40K/mo · retainer
Shopify plan (still required)
₹2-12K/mo · Basic to Advanced

When NOT to migrate

  • · Your store is under ₹2cr annual revenue.
  • · You have no in-house dev and don't want a recurring agency retainer.
  • · You rely heavily on theme-injected apps (reviews, popups, upsell) and don't want to reimplement them.
  • · You change brand creative monthly and need the theme editor for fast iteration.
  • · Your current theme's Lighthouse score is already 80+ on mobile.

Common questions about headless Shopify

Is headless Shopify the same as Shopify Hydrogen?

Hydrogen is one way to build a headless Shopify storefront. It is Shopify&apos;s official React framework (built on Remix), designed for headless commerce, and can deploy to their Oxygen edge hosting. But you can also go headless with Next.js, Nuxt, Astro, or SvelteKit using the Storefront API directly. Hydrogen is opinionated; Next.js is flexible.

Do I still pay Shopify when I go headless?

Yes. You still pay Shopify (Basic, Shopify, Advanced, or Plus) because Shopify continues to run your back office, checkout, payments, and inventory. Headless adds hosting cost for the storefront (Vercel, Netlify, or Oxygen) plus engineering cost to build and maintain it.

Does headless Shopify support Shop Pay and Razorpay?

Yes — Shopify owns the checkout, so all payment options you have configured in Shopify (Shop Pay, Razorpay, Stripe, COD apps) continue to work. The headless storefront hands off to Shopify&apos;s hosted checkout URL when the user clicks &quot;Pay&quot;.

What is the realistic cost of going headless in India?

For an Indian D2C brand, a typical headless Shopify build using Next.js + Storefront API runs ₹2-5 lakh depending on the number of templates, complexity of the PDP, and any custom logic (configurators, bundles, subscriptions). Hydrogen builds are slightly faster to ship but add Oxygen hosting cost. Ongoing maintenance is ₹15-40K/month.

Can I still use Shopify apps with a headless storefront?

Some apps work — back-office apps (inventory, shipping, fulfilment) keep functioning normally. But theme-injected apps (popups, reviews widgets, upsell modals) need to be reimplemented on your front-end. Plan for a few app replacements when scoping a headless migration.

Is headless worth it for a ₹50L/year brand?

Usually no. At that revenue, your bottleneck is marketing and product, not storefront performance. Headless makes sense when you have ₹2cr+ annual revenue, an in-house dev team or a long-term agency partner, and a specific reason — extreme customisation, omnichannel, or a marketing site so content-heavy that traditional Shopify themes become a liability.

How long does a headless migration take?

8-16 weeks for a typical D2C brand with 5-10 templates. Faster if you accept a smaller starter theme; slower if you have heavy custom features (configurators, B2B portals, marketplaces). We typically launch with parity to the existing theme first, then iterate.

Related reading

Considering headless for your D2C brand?

We've migrated Indian D2C stores from Liquid to Next.js + Storefront API. Get in touch— we'll tell you honestly whether headless is worth it for your stage.

bR

buildbyRaviRai Assistant

Replies within 24 hours

Chat on WhatsApp

+91 74289 19927 · Replies within 24 hours

Pick a quick message to start a conversation on WhatsApp — or type your own below. Your message pre-fills, you hit send from WhatsApp.

Or type your own

We'll send your message via WhatsApp Web or the WhatsApp app.