commerce-detail-page-image

commerce-detail-page-image is a skill for Claude Code from modu-ai/moai-cowork. It costs 179 tokens per session (2,494 once invoked), scanned A, original, Apache-2.0.

An image-generation workflow for Korean e-commerce product pages. It creates 13 section images and combines them into one tall PNG for a product detail page.

In plain words
What is it for?
Creating a 1080×12720 product-page image for categories such as electronics, fashion, food, beauty, home, supplements, pets, and children's products.
Why use it?
It removes the need to design each section image and assemble the final long page by hand. It can use product photos and prepared section copy as inputs.

Skill for Claude Code

Written for Claude Code: shipped in a Claude Code plugin.

Needs its repository: it runs a file that does not travel with it, so clone the repository first. The line is ./commerce-output/{job_id}/.

Part of the moai-seller plugin — 11 skills, 2 agents shipped together

Good fit Creating a 1080×12720 product-page image for categories such as electronics, fashion, food, beauty, home, supplements, pets, and children's products.

Compare 6 skills from other repositories ↓
Install

Getting it into your agent

It runs from inside its repository, so the clone comes first — what it calls does not travel with the file alone.

Clone the repo
git clone --depth 1 https://github.com/modu-ai/moai-cowork
agentmods
npx agentmods add skills/modu-ai/moai-cowork/commerce-detail-page-image

Made for: Claude Code.

Or install moai-seller, the plugin that ships this one along with the rest of its 11 skills, 2 agents.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for commerce-detail-page-image

README.md
[![agentmods](https://agentmods.dev/badge/skills/modu-ai/moai-cowork/commerce-detail-page-image/github.svg)](https://agentmods.dev/skills/modu-ai/moai-cowork/commerce-detail-page-image)
Your own site
<a href="https://agentmods.dev/skills/modu-ai/moai-cowork/commerce-detail-page-image"><img src="https://agentmods.dev/badge/skills/modu-ai/moai-cowork/commerce-detail-page-image/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for commerce-detail-page-image

Your own site · 80×15
<a href="https://agentmods.dev/skills/modu-ai/moai-cowork/commerce-detail-page-image"><img src="https://agentmods.dev/badge/skills/modu-ai/moai-cowork/commerce-detail-page-image.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 179 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 2,494 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe. Third-party audits
  • NVIDIA SkillSpector pass 7 Sept 2026
How audits are shown
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00179 $0.02494
Opus 5 $0.00089 $0.01247
Sonnet 5 $0.00036 $0.00499
Haiku 4.5 $0.00018 $0.00249

Measured 8d ago against content hash 01961fce09c3, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-12, from the pricing page.

Security

Grade A, and why

commerce-detail-page-image scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 8d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

plugins/moai-seller/skills/commerce-detail-page-image/SKILL.md · 193 lines

How it starts

The opening of the file, as written. The whole thing — 193 lines — stays where its author put it; the contents beside it link to each section on GitHub.

상세페이지 이미지 합성 (Detail Page Image Composer)

개요

13섹션 감정여정 상세페이지 이미지를 생성하고 세로 합성 PNG로 만드는 스킬입니다. moai-media:media-higgsfield-image를 백엔드로 사용하여 카테고리별 비주얼 톤이 일관된 13장의 섹션 이미지를 만들고, Pillow 단일 의존성으로 1080×12720 단일 합성 이미지를 산출합니다.

트리거 키워드

상세페이지 이미지, 상폐 이미지, 13섹션 이미지, 1080 12720, 상세페이지 합성, 상품 상세 이미지, combined.png, 상폐 합성본, 이커머스 이미지 합성

사전 조건

  1. Pillow 설치: pip install Pillow 또는 uv pip install Pillow

    • Python 3.10+ 환경
    • 다른 의존성 없음 (NumPy 불필요)
  2. moai-coworker 플러그인 활성화: 13섹션 이미지 생성에 media-higgsfield-image 사용

    • 또는 사용자가 별도로 13장의 섹션 이미지를 준비해서 폴더 경로 제공
  3. 상품 사진 1-14장: 실제 상품 레퍼런스 (옵션이지만 권장)

워크플로우

1단계: 입력 수집

다음을 확보합니다:

  • 13섹션 카피 JSON (commerce-detail-page-copy 스킬 출력)
  • 상품 사진 1-14장 경로
  • 카테고리 (electronics/fashion/food/beauty/home/supplement/pet/kids/handmade/general)
  • ProductDNA (선택, commerce-product-photo-brief 스킬 출력)
  • 출력 디렉토리 (기본: ./commerce-output/{job_id}/)

2단계: 13섹션 이미지 프롬프트 생성

각 섹션의 카피와 카테고리 비주얼 브리프를 합쳐 media-higgsfield-image 프롬프트를 작성합니다. references/image-prompts.md 참조 (섹션별 비주얼 언어, 합성 가이드).

각 섹션은 고유한 비주얼 언어를 가집니다:

  • Hero: cinematic_product_portrait — 풀블리드 + 드라마틱 림라이트
  • Pain: emotional_photography_no_product — 어두운 톤, 상품 미노출
  • Problem: clinical_infographic — 깔끔한 인포그래픽
  • Story: editorial_split_before_after — Before/After 좌우 분할
  • Solution: product_beauty_shot — 스튜디오 뷰티샷
  • How: illustrated_step_sequence — 3단계 일러스트
  • Proof: magazine_spread — 매거진 스프레드
  • Authority: portrait_with_quote — 인물 포트레이트 + 인용
  • Benefits: icon_grid_with_lifestyle — 아이콘 그리드 + 라이프스타일
  • Risk: document_with_seal — 문서·인증 스타일
  • Compare: split_screen_vs — 50/50 분할 비교
  • Filter: checklist_visual — 체크리스트 시각화
  • CTA: urgent_product_reveal — 긴급성 + 가격 강조

3단계: 이미지 생성 (moai-media:media-higgsfield-image)

생성 전략:

  • 각 섹션 너비: 1080px
  • 섹션별 높이: references/sections-spec.md 표 참조 (Hero 1600-Filter 700)
  • 카테고리 비주얼 브리프(electronics/fashion/...) 모든 프롬프트에 주입
  • 상품 레퍼런스 사진을 media-higgsfield-image의 image-to-image 모드로 전달

생성 결과를 output_dir/{job_id}/sections/01_hero.png 부터 13_cta.png 까지 저장.

Read the full file on GitHub · 193 lines

Files

What ships with it

3 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 8d ago First seen · 193 lines · 179 tokens per session scan A 01961fce09c3

Subscribe to this mod's changes

commerce-detail-page-image is a skill published in the GitHub repository modu-ai/moai-cowork (300 stars, last pushed 9d ago), licensed Apache-2.0. It adds 179 tokens to every session and 2,494 once invoked, about $0.0009 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-03.

Related

Other skills, from other repositories

xml-config-migrating

Use this skill when a Shopware plugin or app-server extension needs its XML configuration migrated to PHP — phrases like "migrate services.xml", "convert my plugin config to PHP", "xml to php migration", "fix the XML deprecation", "prepare my plugin for Shopware 6.8 / Symfony 8", or when a deprecation like "The XML…

shopwareLabs/ai-coding-tools · 106 tokens

dev-environment-bootstrapping

Use this skill when the user asks to bootstrap, set up, create, or initialize a Shopware development environment from scratch — phrases like "set up a Shopware dev environment", "clone and install Shopware", "initialize a Shopware plugin project", "bootstrap Shopware and a new plugin called X", "get a fresh Shopware…

shopwareLabs/ai-coding-tools · 144 tokens

recipe-log-deal-update

Append a deal status update to a Google Sheets sales tracking spreadsheet.

fakoli/fakoli-plugins · 19 tokens

product-configurator-design

Designing build-your-own product configurators (Tesla-style, custom-pricing, plan-builders) with constraint logic, real-time pricing, validation, and save-and-share mechanics. Honest about infinite-options (decision paralysis), canned-bundles-only (no real customization), and guided-configuration (smart defaults plus…

rampstackco/claude-skills · 129 tokens

email-personalization

Write hyper-personalized cold email icebreakers for B2B leads using their company intelligence and LinkedIn data. Use this skill whenever the user says "write icebreakers", "personalize emails", "email personalization", "cold email first lines", "write opening lines", "personalize outreach", "create email openers", or…

naveedharri/benai-skills · 134 tokens

marketplace-purchase-vetting

Use this when the user asks whether a local listing is a scam, "too good to be true," worth looking at, or a good deal. Also use this when he asks you to find options — search/discover candidates, then vet the best ones. The goal is not a generic buying guide; it is a practical risk read with clear next steps.

AtlasOmnia/donna-starter · 72 tokens