Curated skills for Claude Code

Give a Shopify storefront an editorial, high-fashion feel inspired by houses like Louis Vuitton — restrained palette, generous negative space, refined typography, full-bleed imagery, and quiet motion. Trigger when the brief calls for luxury, editorial, premium, or fashion.

Connect a theme to a real Shopify store with the Shopify CLI and run the build loop — authenticate, live-preview with hot reload, lint, and push. Trigger before building or editing any theme, or when previewing/deploying to a store.

Scaffold a complete Online Store 2.0 theme from scratch — directory layout, theme.liquid, settings_schema, and JSON templates wired to sections. Trigger when starting a new theme or restructuring one to be sections-everywhere.

Write idiomatic, performant Liquid for Shopify themes. Trigger when authoring or reviewing .liquid templates, snippets, or sections.

Build a refined Shopify collection page — editorial banner, a calm responsive product grid, filtering and sorting from the Storefront Filtering API, and quiet pagination. Trigger when building the collection template or product listing pages.

Build a persistent luxury header and footer for a Shopify theme — transparent-over-hero sticky header, refined mega-menu from linklists, and a quiet multi-column footer. Trigger when building site chrome, navigation, header, or footer.

Compose a luxury Shopify home page from editorial sections — full-bleed hero, editorial split, featured product grid, and a lookbook/marquee — each a configurable OS 2.0 section. Trigger when building the index template or home page sections.

Model and surface Shopify metafields and metaobjects in a theme. Trigger when adding custom content or connecting dynamic sources in the theme editor.

Build a luxury Shopify product detail page (PDP) — full-height gallery, a quiet buy box with variant selection, a details accordion, and related products. Trigger when building the product template or PDP.

Lint a Shopify theme with Theme Check and fix the findings. Trigger before committing theme changes or when asked to validate a theme.

Scaffold a Shopify theme section with a proper {% schema %}, settings, and blocks. Trigger when building or editing sections in an Online Store 2.0 theme.

Model a visual CMS as a Shopify OS 2.0-style theme contract — a ThemeBundle of primitive settings, JSON templates, and section instances, normalized on every read, in a zero-dependency package both the editor and the public renderer import. Trigger when building or extending a page builder, theme engine, or customizer, or when deciding what lives in the bundle versus beside it.

Drive a CMS theme editor as a three-pane customizer over a live cross-origin preview — query-marker preview (not a cookie), a theme-scoped token, load-bearing data-section-id hooks, and both render paths sharing every resolver. Trigger when building or extending a theme editor, visual customizer, or in-canvas section inspector.

Turn a customer design (Figma, HTML, a Claude Design export) into an editable CMS section that is DATA, not code — a tag-allowlisted template tree, CSS scoped on write, types namespaced custom:<id>, snapshotted at publish. Trigger when importing a design into a page builder, building a section importer, or deciding how user-authored sections render.

Split CMS pages from the theme — a page is a workspace-scoped row (Content) and the theme supplies only the layout it renders through (Theme), with variant fallback to default so a theme swap never 404s a live URL. Trigger when adding pages, templates, or handles to a page builder, or when deciding whether something belongs in the bundle.

Publish a CMS theme as an append-only snapshot and serve the public site over a bearer-gated read seam the renderer caches per HOST — the site never touches the database, and a shared cache key is a cross-tenant leak. Trigger when adding publish, rollback, ISR, preview tokens, or a public renderer to a page builder.

Declare every first-party CMS section as four artifacts — a manifest, a React component, a registry entry, and a preset — with settings, blocks, CTAs, and spacing generated from the manifest. Trigger when adding or editing a section in a page builder, or when mapping a design onto a section contract.

Tenant a multi-tenant CMS by resolving a workspace you own — membership is yours (Clerk authenticates a person and nothing else), resolution never creates a workspace, the active-workspace cookie is a hint, and billing gates on the write. Trigger when adding workspaces, domains, seats, Stripe, or host routing to a page builder.

Write commit messages in the Conventional Commits format. Trigger when composing a git commit, squashing, or writing a changelog entry.

Draft a clear pull request description from the current diff. Trigger when opening a PR or asked to summarize a branch of changes.

Maintain a Keep a Changelog style CHANGELOG.md. Trigger when a change ships or the user asks to update the changelog.

Wire Clerk into a Next.js App Router app — middleware-protected dashboard routes, sign-in/sign-up pages, an auth-aware home CTA, and the user menu. Trigger when adding authentication to a dashboard app or protecting a route subtree.

Decide when a destructive action deserves a modal and how to word it — ask only when the answers genuinely differ, plan the outcome once and describe it with the same function that carries it out, and offer consequences instead of verbs. Trigger when adding a delete/remove/discard/overwrite confirmation, or when a dialog's copy has to state what will happen.

Scaffold a Next.js App Router project split into a public marketing surface and a protected dashboard — route groups, layouts, and a home page with sign-in CTAs. Trigger when starting a new dashboard-style app.

Build dashboard views with shadcn/ui — sidebar navigation shell, header with user menu, stat cards, and data tables, all composed from generated components you own. Trigger when building the authenticated UI of a dashboard app.

Build the canvas of a visual flow builder on React Flow — node cards with one handle per outlet, hover plus buttons that aim before they add, a placeholder that reserves the slot, and layout that stays the author's. Trigger when building or changing the canvas, node cards, connectors, or add/insert/remove interactions of a flow builder.

Model a visual automation flow as a validated node/edge graph — a discriminated union of node configs, outlet-labelled edges, single-path execution, and one canonical comparison shared by the save gate and the unsaved badge. Trigger when building or extending a flow/journey/workflow builder, or when adding to its graph schema.

Build the right rail of a flow builder — one slide-out that takes turns holding the step inspector, the step palette, flow details, the test harness and history — plus per-type config forms with a field picker and a JSON escape hatch. Trigger when building the panel, palette, or node config forms of a flow builder.

Declare every step type of a flow builder in one catalog the palette, the engine, the simulator and the field picker all read — outlets, default config, purity, and the assumption a preview makes. Trigger when adding a node/step/block type to a flow builder, or when deciding what outlets a step should have.

Give a flow builder a trustworthy preview — an in-browser simulator that shares the engine's own evaluators, labels every assumption it cannot compute, feeds the field pickers, and sits beside a real journaled test run. Trigger when adding path preview, a test panel, dry runs, or a `{{field}}` picker to a flow builder.

Version a flow graph and move it between accounts — a revision per save with a deterministic structural diff, optimistic concurrency, restores that write forward, and an export that carries descriptors instead of credentials. Trigger when adding history, revisions, rollback, or import/export to a flow builder.

Set up Postgres with Drizzle ORM — Docker Compose for the local database, schema and migrations with drizzle-kit, and a single DATABASE_URL that production simply overrides. Trigger when adding persistence to an app or standing up a local database.

Build the form authoring surface — a field palette, a drag-and-drop canvas that packs fields into rows, and an inspector for the selected field. Trigger when implementing the editor where someone assembles a form.

Define the form document an author edits and a renderer draws — field catalog, widths, submission keys, steps, and conditional rules. Trigger when modeling forms, adding a field type, or sharing one form shape across a builder and a public embed.

Deliver a saved form submission to outside systems through a catalog of connectors. Trigger when adding a destination such as a spreadsheet, email list, CRM, or webhook, or when wiring what happens after someone submits.

Show the in-progress form in a preview panel using the same renderer the published page uses, including unsaved edits, conditional visibility, and multi-step navigation. Trigger when adding or changing the builder's preview.

Publish a form as framework-free custom elements that fetch their configuration and post submissions. Trigger when embedding a form on a page the builder does not control — a storefront, a CMS page, or any other host.