For designers handing off to engineers: specs so precise the build matches the design. — built in-house by Skill Me.

Reach for this when you're handing a design to engineering and you're tired of the build coming back wrong. It gives you the full handoff toolkit - a single source-of-truth handoff doc, precise redline annotations, and dedicated specs for motion and responsive behavior - plus a QA checklist to verify the implementation before sign-off. The result: fewer Slack round-trips, no guesswork at the design-to-code boundary, and shipped UI that matches intent.

⭐ If this is useful, star the repo — it's how we gauge what to build next.

• From the catalog: skillme.dev/pack/designer-to-dev-handoff — install the whole pack into Claude in one step.
• With the skills CLI: npx skills add SkillMedev/designer-to-dev-handoff
• Manually: copy any skills/<slug>/SKILL.md into your Claude skills directory.

• Design QA Checklist — Runs an ordered design QA pass over an implemented UI - layout, type, color, states, motion, content - against the design spec, with concrete tolerances and a filed defect list.
• Redline Annotation — Produces precise redline annotations - spacing, sizing, type, color, radius, z-order, and behavior notes in a consistent, scannable notation - that engineers can build from without asking questions.
• Motion Spec — Specifies animation and motion precisely - duration, easing curve, trigger, and intent - for accurate engineer implementation.
• Responsive Spec — Specifies responsive behavior across breakpoints - layout reflow, content priority, touch targets, and fluid-versus-stepped scaling rules - precisely enough for engineers to implement directly.
• Design Handoff Doc — Writes a complete design handoff document covering components, design tokens, interaction states, and edge cases for engineering implementation.
• Prototype Spec — Turns a static design into a numbered, testable, dev-ready specification covering every state, interaction, breakpoint, motion detail, and edge case the mockup cannot show.
• Component API Design — Designs React/Vue component APIs - props, composition, event handling, accessibility. (external — see source)
• Color Accessibility — Audits and repairs color palettes against WCAG contrast thresholds - 4.5:1 for body text, 3:1 for large text and UI components, 7:1 for AAA - and makes them safe for color-blind users, delivering a verified pairing table.

MIT — see LICENSE. Skills are portable SKILL.md files; the canonical copies live in the Skill Me catalog.