메뉴
Converts UI screenshots and design mockups into production-ready HTML/CSS code. Multi-agent architecture analyzes layout, plans structure, generates clean code. Use when you have a design image and need code. Don't use for code-to-code tasks.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | screen-coder |
| description | Converts UI screenshots and design mockups into production-ready HTML/CSS code. Multi-agent architecture analyzes layout, plans structure, generates clean code. Use when you have a design image and need code. Don't use for code-to-code tasks. |
| disable-model-invocation | true |
| model | opus |
| effort | high |
| allowed-tools | Read, Write, Bash, Glob |
| argument-hint | ["path-to-screenshot"] |
Convert a UI design screenshot into production-ready code.
Machine learning model training with HuggingFace. Fine-tuning LLMs, dataset creation, GPU selection, training monitoring. Use for training custom models. Don't use for using pre-trained models via API.
Estimates project cost at market rates. Scans codebase, counts APIs, integrations, and complexity. Shows what the project would cost without AI. Use for pitches and ROI demonstrations.
Marketing and conversion optimization. Landing page CRO, copywriting, positioning, GTM strategy, A/B testing. Don't use for product development or technical decisions.
Product management frameworks. PRD writing, user stories, OKRs, roadmap, TAM/SAM/SOM analysis, competitive research. Don't use for technical implementation.
Scraping specific platforms with ready connectors. Google Maps businesses, Twitter trends, YouTube subtitles, Instagram/TikTok content. Use for platform-specific data collection.
Data analysis from external services. Connects to Google Sheets, Notion, HubSpot via Composio. Builds charts, runs queries, generates insights. Don't use for database queries.
