Product Detail
Design and build the product detail page (PDP) — media gallery, the buy-box hierarchy (name → price → variant picker → one Add-to-cart), spec sheet, and trust signals — anchored by the Swatch-Driven Hero Crossfade — selecting a colour/material swatch crossfades the gallery, updates price inline, and writes URL state with no full reload and no WebGL. Invoke in Phase 6 for any product page — trigger phrases — "product page", "PDP", "product detail", "variant picker", "colour swatches", "size selector", "add-to-cart layout", "product gallery", "material preview", "lightweight configurator".
Works with: Claude Code (native) · Cursor, Codex CLI (manual)
native: this artifact type is that client's own format
Install (Claude Code):
cp -r product-detail ~/.claude/skills/- Adoption: 1 repos
- Upkeep: 99.0
- Freshness: 97.0
- Evidence coverage: 84% of the inputs this score can use — the rest are unknown, and the score is discounted for it
- Health: active
- Contributors: 3
- License: MIT
Security audit
Not scanned yet. We audit npm-published capabilities for known advisories, install-time scripts and permission surface; this one has no npm package we can resolve, or has not reached the queue.
Its own instructions
Its SKILL.md covers setup.
Read from the capability’s own SKILL.md. This is not a grade and does not compare to the instruction-depth verdict on an MCP server — a skill has no tools to document, so that rubric does not apply to it.
You searched for one. Check the rest of your stack:
npx tashan-cli doctorReads the config already on your machine and names what is dead, deprecated or running code at install time. No account, nothing uploaded.
Pro adds the history to tashan doctor, so a run over your own config says which of yours gained an advisory, started running an install script, or lost its last maintainer — and what to move to.
- Every score since we started measuring, for any capability
- The named replacement when something you run is dying — not just that it is
tashan doctorover the config you already have, on your machine
Start a 7-day trial › Everything measured on this page stays free.
source ↗ · skill:blyatiful1/product-detail
Everything on this page is public evidence and free. What it cannot know is whether you run this — check your whole config, free, in the browser. tashan Pro adds the series behind each row and names a replacement for anything dying.
Already running this? Check your whole config — free, in your browser, nothing installed. Or npx tashan-cli doctor locally, which sends nothing at all.
Measured 2026-08-23 · scorer s5 · how · something wrong here?