Builds a front-end screen as real, production-quality code from a Figma export, for any stack (React/Tailwind, CSS Modules, React Native, SwiftUI, Jetpack Compose, Flutter, or a custom target). Use this whenever the user wants a design turned into code — "implement the login screen", "build this frame", "code up the settings page", "make this design real", "match the Figma" — or points at a…
Install
npx skills add its-magdy/design-twin --skill build-screennpx skills add its-magdy/design-twin --skill build-screen -a claude-code -gnpx skills add its-magdy/design-twin --skill build-screen -a codex -ggemini skills install https://github.com/its-magdy/design-twin.git --path claude-plugin/skills/build-screengh skill install its-magdy/design-twin build-screengit clone --depth 1 https://github.com/its-magdy/design-twin /tmp/its-magdy__design-twin
mkdir -p ~/.claude/skills ~/.agents/skills
cp -R /tmp/its-magdy__design-twin/claude-plugin/skills/build-screen ~/.claude/skills/build-screen # Claude Code
cp -R /tmp/its-magdy__design-twin/claude-plugin/skills/build-screen ~/.agents/skills/build-screen # Codex, Cursor, Gemini CLI, Copilot, OpenCode