DEV Community

Mohammed Dawoud
Mohammed Dawoud

Posted on

I built an AI skill that generates a complete Shopify theme from an interview

Building a production Shopify theme from scratch is days of work: JSON templates, sections with schemas, blocks, section groups, locale files, RTL, accessibility, performance — and then wiring every piece to the theme editor so the merchant never touches code.

I wanted that to happen from a conversation. So I built shopify-theme-builder — an open-source AI skill that interviews you about your store, then generates a complete Online Store 2.0 theme.

How it works

It runs a short, batched discovery interview — store archetype, brand direction, languages/markets, template scope, features, metafields — infers sensible defaults for anything you skip, then moves through gated phases: architecture plan → scaffold → build sections → design pass → i18n/RTL → QA → package. Say "just build it" to skip the questions.

The non-negotiables it enforces

  1. 100% theme-editor controllable — no hard-coded text, color, font, or image anywhere. Every value is a setting, block, or section group. If a merchant would need a developer to rebrand, that's treated as a defect.
  2. Systemized design — one token layer (settings_schema.json → CSS custom properties) drives all color, type, spacing, radius, shadow, and motion. Change a token, restyle the whole store.
  3. Shopify-compliant — valid {% schema %} on every section, theme-check clean, no deprecated Liquid, built to Theme Store standards (mirrors Dawn where in doubt).

Plus: bilingual Arabic/English + full RTL by default, WCAG 2.1 AA, responsive srcset images, and structured data — the stuff that's easy to skip and painful to retrofit.

Works across agents

It's an Agent Skill: native in Claude Code, and usable in Codex, Cursor, and Windsurf through an AGENTS.md adapter. Same workflow, one source of truth.

Try it


bash git clone https://github.com/moVictor99/shopify-theme-builder
# Claude: ./install.sh   |   others: keep the repo in your project
Enter fullscreen mode Exit fullscreen mode

Top comments (0)