design-handoff-spec
CommunityBridge design and development seamlessly.
Design & Creative#accessibility#figma#design tokens#component documentation#developer handoff#design handoff#ui specifications
AuthorNir-Bhay
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill streamlines the process of translating design mockups into actionable specifications for developers, ensuring pixel-perfect implementation and reducing ambiguity.
Core Features & Use Cases
- Detailed Component Specs: Generates comprehensive documentation for UI components, including layout, typography, colors, and states.
- Asset Requirements: Defines clear guidelines for asset formats, sizes, and naming conventions.
- Use Case: A designer can use this Skill to generate a detailed specification for a new button component, including its different states (hover, active, disabled), color variations, typography, and export requirements for icons, ensuring developers have all necessary information.
Quick Start
Generate a design specification for a primary button component.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: design-handoff-spec Download link: https://github.com/Nir-Bhay/markups/archive/main.zip#design-handoff-spec Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.