Favicon of design-handoff

design-handoff Skill

AI Agent SkillDesign & MediaPythonOpen source

Generate developer handoff specs from a design. Use when a design is ready for engineering and needs a spec sheet covering layout, design tokens, component props, interaction states, responsive breakpoints, edge cases, and animation details. Published by anthropics in knowledge-work-plugins.

Decision snapshot

Is this a fit?

Best for

Documentation, Data analysis, Design and media, Includes SKILL.md

Works with

Compatibility not yet detected.

Access

Permission behavior not yet detected.

Setup

Copy skill directory

Project health

22 days ago · Apache-2.0 license

Considerations

No specific cautions were detected. Review the source and requested permissions before installing.

What is design-handoff Skill?

Generate developer handoff specs from a design. Use when a design is ready for engineering and needs a spec sheet covering layout, design tokens, component props, interaction states, responsive breakpoints, edge cases, and animation details. Published by anthropics in knowledge-work-plugins. This profile combines repository metadata with install, compatibility, and usage signals so developers can quickly decide whether it fits their agent workflow before opening the source repository.

Trust signal
95/100
Maintenance signal
90/100
Adoption signal
100/100

Automated repository signals based on public metadata such as recency, license, installation evidence, and adoption. These are not a security audit or endorsement. See how SkillIndex evaluates profiles.

Key capabilities

  • Includes SKILL.md support
  • Reusable instructions support
  • Documentation
  • Data analysis
  • Design and media
  • Documentation use cases
  • Data analysis use cases

Declared skill metadata

  • Source file: design/skills/design-handoff/SKILL.md

These fields retain source and confidence evidence from the indexed SKILL.md.

Compatibility and setup

Copy skill directory
  • Install or run with Copy skill directory

When to use design-handoff Skill

  • Use it for documentation.
  • Use it for data analysis.
  • Use it for design and media.

Built with

PythonCopy skill directory

Editorial notes

Source

  • Creator: anthropics
  • Repository: anthropics/knowledge-work-plugins
  • Skill file: design/skills/design-handoff/SKILL.md

What it does

Generate developer handoff specs from a design. Use when a design is ready for engineering and needs a spec sheet covering layout, design tokens, component props, interaction states, responsive breakpoints, edge cases, and animation details.

Skill instructions

/design-handoff If you see unfamiliar placeholders or need to check which tools are connected, see CONNECTORS.md. Generate comprehensive developer handoff documentation from a design. Usage /design-handoff $ARGUMENTS Generate handoff specs for: @$1 If a Figma URL is provided, pull the design from Figma. Otherwise, work from the provided description or screenshot. What to Include Visual Specifications - Exact measurements (padding, margins, widths) - Design token references (colors, typography, spacing) - Responsive breakpoints and behavior - Component variants and states Interaction Specifications - Click/tap behavior - Hover states - Transitions and animations (duration, easing) - Gesture support (swipe, pinch, long-press) Content Specifications - Character limits - Truncation behavior - Empty states - Loading states - Error states Edge Cases - Minimum/maximum content - International text (longer strings) - Slow connections - Missing data Accessibility - Focus order - ARIA labels and

Verified compatibility and discovery

Frequently asked questions

What is design-handoff?

design-handoff is a open-source AI agent skill with Copy skill directory. Generate developer handoff specs from a design. Use when a design is ready for engineering and needs a spec sheet covering layout, design tokens, component props, interaction states, responsive.

Who is design-handoff best for?

design-handoff is best for reusing agent instructions, scripts, and references, documentation workflows, data analysis workflows, design and media workflows.

How do I install design-handoff?

Install or run design-handoff using Copy skill directory. Check design-handoff for the latest setup command.

Is design-handoff actively maintained?

design-handoff may need a closer maintenance check before production use.

Share:

Stars
23,523
Forks
2,835
Last commit
22 days ago
Last verified
Aug 21, 2026
Metadata fetched
Aug 21, 2026
Repository age
8 months
License
Apache-2.0

Project health auto-fetched from the source repository.

Maintain this resource?

Review this source-backed profile, send a correction with evidence, or link to it from your documentation. Claims verify your relationship to the project; profile facts still require source evidence and editorial review.

Alternatives to design-handoff