design-ship

design-ship is a skill for Claude Code from yonatangross/orchestkit. It costs 84 tokens per session (2,402 once invoked), scanned A, original, MIT.

An end-to-end workflow that turns a Claude Design handoff into a reviewable GitHub pull request. It imports the design, adds Storybook stories and browser tests, verifies the result, and opens the pull request.

In plain words
What is it for?
Use it when a Claude design link should become tested React components and a GitHub pull request, including Playwright end-to-end tests for new views.
Why use it?
It joins design import, testing, visual checking, and review preparation into one process instead of requiring separate manual steps.

Skill for Claude Code

Written for Claude Code: allowed-tools in frontmatter. Also seen: model in frontmatter; names the AskUserQuestion tool; mentions Claude Code.

Part of the ork plugin — 106 skills, 35 commands, 36 agents, 32 hooks shipped together

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add skills/yonatangross/orchestkit/design-ship
Any agent
npx skills add yonatangross/orchestkit --skill design-ship
Clone the repo
git clone --depth 1 https://github.com/yonatangross/orchestkit

Made for: Claude Code.

Or install ork, the plugin that ships this one along with the rest of its 106 skills, 35 commands, 36 agents, 32 hooks.

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 design-ship

README.md
[![agentmods](https://agentmods.dev/badge/skills/yonatangross/orchestkit/design-ship.svg)](https://agentmods.dev/skills/yonatangross/orchestkit/design-ship)
Your own site
<a href="https://agentmods.dev/skills/yonatangross/orchestkit/design-ship"><img src="https://agentmods.dev/badge/skills/yonatangross/orchestkit/design-ship.svg" alt="Measured on agentmods" height="20"></a>
Per session 84 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 2,402 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
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.00084 $0.02402
Opus 5 $0.00042 $0.01201
Sonnet 5 $0.00017 $0.00480
Haiku 4.5 $0.00008 $0.00240

Measured 3d ago against content hash 196114713f35, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-06, from the pricing page.

Security

Grade A, and why

design-ship 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 3d 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/ork/skills/design-ship/SKILL.md · 269 lines

How it starts

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

Design Ship

One command: Claude Design handoff URL → reviewable GitHub PR.

/ork:design-ship https://claude.ai/design/abc123     # From handoff URL
/ork:design-ship /tmp/handoff-bundle.json            # From local file

When to use

You have a Claude Design handoff URL (or file) and want a PR opened against the current branch. No intermediate steps, no manual test generation, no manual PR drafting.

For just-the-import (no tests, no PR), use /ork:design-import instead.

Pipeline

Handoff bundle (URL or file)
  │
  ▼
┌──────────────────────────────┐
│ 1. /ork:design-import         │  Scaffold components, write provenance
│    (delegates to orchestrator │  Tokens reconciled
│     for parse + dedup)        │  Components written or reused
└──────────┬───────────────────┘
           │
           ▼
┌──────────────────────────────┐
│ 2. /ork:cover                 │  Storybook stories per new component
│    (Storybook + Playwright)   │  Playwright E2E for new routes/views
└──────────┬───────────────────┘
           │
           ▼
┌──────────────────────────────┐
│ 3. /ork:expect                │  Diff-aware browser verification
│    (CDP + ARIA-tree-first)    │  Screenshots saved for PR body
└──────────┬───────────────────┘
           │
           ▼
┌──────────────────────────────┐
│ 4. /ork:create-pr             │  PR opened with:
│                               │   - Claude Design URL link
│                               │   - Before/after screenshots
│                               │   - Component scaffold list
│                               │   - Coverage delta
│                               │   - Label: claude-design
└──────────┬───────────────────┘
           │
           ▼
┌──────────────────────────────┐
│ 5. UPDATE PROVENANCE          │  Patch .claude/design-handoffs/<id>.json
│                               │  with the opened PR number + URL
└──────────────────────────────┘

Pre-flight

Before starting the pipeline, verify the working tree is clean enough to ship:

Read the full file on GitHub · 269 lines

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. 3d ago First seen · 269 lines · 84 tokens per session scan A 196114713f35

Subscribe to this mod's changes

design-ship is a skill published in the GitHub repository yonatangross/orchestkit (229 stars, last pushed today), licensed MIT. It adds 84 tokens to every session and 2,402 once invoked, about $0.0004 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

screen-reader-testing

Test web applications with screen readers including VoiceOver, NVDA, and JAWS. Use when validating screen reader compatibility, debugging accessibility issues, or ensuring assistive technology support.

wshobson/agents · 39 tokens

accessibility-selenium-testing

Accessibility testing toolkit using Selenium WebDriver 4+ with Java 21+ and axe-core engine. Use when asked to validate WCAG 2.2 AA compliance, scan pages or components for a11y violations, test keyboard navigation, audit color contrast, check ARIA semantics, generate accessibility reports, filter axe rules, debug…

fugazi/test-automation-skills-agents · 92 tokens

testing-react

Stratégie de Tests React 19 + Compiler 1.0. Use when writing tests, reviewing test coverage, or setting up testing.

TheBeardedBearSAS/claude-craft · 32 tokens

hatch3r-a11y-audit

Runs a WCAG AA accessibility audit with findings and fixes across 7 scan categories (keyboard, contrast, ARIA, reduced motion, screen reader, high contrast, automated axe). Use when auditing and remediating accessibility.

hatch3r/hatch3r · 55 tokens

visual-validate

Validate UI changes in a real browser using Chrome DevTools or Playwright MCP. Takes screenshots, compares before/after, exercises interactions, captures console errors. Use when user asks to "visual validate", "/visual-validate", "check the UI", "screenshot before/after", or finishes a UI change. Don't use for unit…

helderberto/agent-skills · 96 tokens

run-smoke-tests

Run Playwright smoke tests, debug failures, and verify fixes. Use for smoke, e2e, Playwright, or pre-ship browser verification.

Kripu77/software-factory · 36 tokens