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

2 months 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
2 months ago
Last verified
Aug 21, 2026
Metadata fetched
Aug 21, 2026
Repository age
9 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