Shopify Hydrogen

Name: Shopify Hydrogen
Author: shopify

shopify/shopify-ai-toolkit

Ship a headless Shopify storefront with Hydrogen while aligning Storefront and Admin API version pins.

Overview

Shopify Hydrogen is an agent skill for the Build phase that guides headless Shopify storefront work with a structured API version catalog for Hydrogen and Storefront GraphQL.

Install

npx skills add https://github.com/shopify/shopify-ai-toolkit --skill shopify-hydrogen

What is this skill?

Version manifest for five Shopify API families: admin, storefront-graphql, partner, customer, and payments-apps
Pins stable calendar releases (e.g. 2026-04 latest) plus unstable and release-candidate tracks
Keeps headless commerce agents aligned on the same API contract as Hydrogen and Oxygen deployments
Reduces drift between theme logic, checkout extensions, and storefront queries during iterative builds
Five API surface families in the version manifest: admin, storefront-graphql, partner, customer, payments-apps
Multiple dated stable API lines plus unstable and release-candidate tracks per surface

Compatible agents: Claude Code, Cursor, Codex, any compatible agent

Adoption & trust: 4.7k installs on skills.sh; 373 GitHub stars; 2/3 security scanners passed (skills.sh audits).

What problem does it solve?

You are building a custom Shopify storefront but your agent keeps mixing Admin, Storefront, and Partner API versions across generated code.

Who is it for?

Solo builders or tiny teams shipping a Hydrogen/Oxygen headless shop who want version-aware codegen and reviews.

Skip if: Merchants staying on Online Store 2.0 themes only, or teams that do not use Shopify’s headless stack.

When should I use this skill?

When implementing or reviewing a Hydrogen storefront and you need Shopify API version alignment across Admin and Storefront GraphQL.

What do I get? / Deliverables

Your Hydrogen implementation targets explicit, consistent API version pins across the five documented Shopify API surfaces.

Version-aligned Hydrogen route and loader patterns
Consistent API version references for codegen and review

Recommended Skills

Frontend Designanthropics/skills

Frontend Design is an agent skill for solo and indie builders who want web interfaces that look intentional, not like ev…516k installs·148k stars

Vercel React Best Practicesvercel-labs/agent-skills

Vercel React Best Practices is an agent skill packaging Vercel Engineering’s performance playbook for React and Next.js.…459k installs·27.7k stars

Remotion Best Practicesremotion-dev/skills

Remotion Best Practices is a domain knowledge agent skill for solo and indie builders who ship video with Remotion—progr…357k installs·3.5k stars

Vercel Composition Patternsvercel-labs/agent-skills

Vercel Composition Patterns is an agent-oriented skill from Vercel Labs that documents how solo and indie builders shoul…204k installs·27.7k stars

Develop Userscriptsxixu-me/skills

Guides building and fixing browser userscripts for Tampermonkey and ScriptCat, emphasizing runtime selection, minimal pe…154k installs·61 stars

Next Best Practicesvercel-labs/next-skills

Next Best Practices is a Vercel Labs agent skill that encodes how to write and review modern Next.js App Router projects…102k installs·919 stars

Journey fit

Primary fit

BuildUI/UX & frontend

Hydrogen is storefront implementation work, which maps to the Build phase on the canonical frontend shelf. Customer-facing Remix/React routes, loaders, and Storefront GraphQL live in frontend build, not launch SEO or ops.

Also useful

BuildIntegrations & version control

Also useful

ShipCI/CD & deploy

How it compares

Use for Shopify Hydrogen storefront builds—not generic React ecommerce tutorials unrelated to Storefront API contracts.

Common Questions / FAQ

Who is shopify-hydrogen for?

Indie developers and small agencies building headless Shopify storefronts with Hydrogen who need API version discipline while coding with an AI agent.

When should I use shopify-hydrogen?

Use it during Build when scaffolding routes, data loaders, or integrations; revisit in Ship if you are validating API compatibility before release.

Is shopify-hydrogen safe to install?

Treat it like any third-party agent skill: review the Security Audits panel on this Prism page and limit network or secret access in your agent settings.

SKILL.md

READMESKILL.md - Shopify Hydrogen

{
  "admin": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "storefront-graphql": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "partner": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "customer": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "payments-apps": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "polaris-app-home": [],
  "polaris-admin-extensions": [
    {
      "name": "2026-04",
      "releaseCandidate": true
    },
    {
      "name": "2026-01",
      "latestVersion": true
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "polaris-checkout-extensions": [
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "polaris-customer-account-extensions": [
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "pos-ui": [
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "hydrogen": [
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "storefront-web-components": [],
  "functions_cart_checkout_validation": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "functions_cart_transform": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "functions_delivery_customization": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "functions_discount": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {

What is this skill?

Version manifest for five Shopify API families: admin, storefront-graphql, partner, customer, and payments-apps

Pins stable calendar releases (e.g. 2026-04 latest) plus unstable and release-candidate tracks

Keeps headless commerce agents aligned on the same API contract as Hydrogen and Oxygen deployments

Reduces drift between theme logic, checkout extensions, and storefront queries during iterative builds

Five API surface families in the version manifest: admin, storefront-graphql, partner, customer, payments-apps

Multiple dated stable API lines plus unstable and release-candidate tracks per surface

Compatible agents: Claude Code, Cursor, Codex, any compatible agent

Adoption & trust: 4.7k installs on skills.sh; 373 GitHub stars; 2/3 security scanners passed (skills.sh audits).

Journey fit

Primary fit

BuildUI/UX & frontend

Also useful

BuildIntegrations & version control

Also useful

ShipCI/CD & deploy

SKILL.md

READMESKILL.md - Shopify Hydrogen

{
  "admin": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "storefront-graphql": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "partner": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "customer": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "payments-apps": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "polaris-app-home": [],
  "polaris-admin-extensions": [
    {
      "name": "2026-04",
      "releaseCandidate": true
    },
    {
      "name": "2026-01",
      "latestVersion": true
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "polaris-checkout-extensions": [
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "polaris-customer-account-extensions": [
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "pos-ui": [
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "hydrogen": [
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "storefront-web-components": [],
  "functions_cart_checkout_validation": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "functions_cart_transform": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "functions_delivery_customization": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {
      "name": "2026-04",
      "latestVersion": true
    },
    {
      "name": "2026-01"
    },
    {
      "name": "2025-10"
    },
    {
      "name": "2025-07"
    }
  ],
  "functions_discount": [
    {
      "name": "unstable"
    },
    {
      "name": "2026-07",
      "releaseCandidate": true
    },
    {

Overview

Install

What is this skill?

What problem does it solve?

Who is it for?

When should I use this skill?

What do I get? / Deliverables

Recommended Skills

Journey fit

Who is shopify-hydrogen for?

When should I use shopify-hydrogen?

Is shopify-hydrogen safe to install?

SKILL.md

This week for builders

Overview

Install

What is this skill?

What problem does it solve?

Who is it for?

When should I use this skill?

What do I get? / Deliverables

Recommended Skills

Journey fit

Who is shopify-hydrogen for?

When should I use shopify-hydrogen?

Is shopify-hydrogen safe to install?

SKILL.md