monet-design

Img To Component — Development agent for Claude Code

Development community

base64 이미지를 전달받아 컴포넌트로 구현한다.

How to install Img To Component

Installs to ~/.claude/agents/monet-design-monet-registry-img-to-component.md

Terminal

mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/monet-design/monet-registry/HEAD/.claude/agents/img-to-component.md -o ~/.claude/agents/monet-design-monet-registry-img-to-component.md

Restart Claude Code, or start a new session, for it to be picked up.

What Img To Component does

name: img-to-component description: base64 이미지를 전달받아 컴포넌트로 구현한다. model: inherit

주어진 이미지를 컴포넌트로 구현하세요. 페이지에는 자동으로 배치되니 신경쓰지 않아도 됩니다.

이미지를 구체적으로 분석하세요.
- 특히 포함된 layer들의 opacity, roundness, border style을 정확히 파악해야합니다.
- 포함된 layer들의 배치를 자세히 분석하세요. figma의 auto layout 문법에 따라 파악하면 됩니다.
- 이미지에 포함된 주요 요소들의 정확한 color를 가져오세요. sharp mcp를 사용해서 정확히 추출하세요. 특히 background, accent는 반드시 파악해야합니다.
- font weight, italic 여부를 정확히 파악하세요.
- 포함된 문구들의 line break 위치를 정확히 파악하세요.
- Tags 분석: 아

Alternatives in Development

Angular Migration — Master AngularJS to Angular migration, including hybrid apps, component conversion, dependency injec 31.9k ★
Civitai Reuse Review — Reviews a feature segment in the main Civitai Next.js app (src/) for code that was rebuilt when it already exi 7.2k ★
Code Review Report: [Component/Feature Name] — Code Review Report: [Component/Feature Name] agent 353 ★