클릭한 화면 요소를 재구현 프롬프트로 바꾸는 무료 도구

Snip2는 웹페이지에서 원하는 화면 요소를 클릭하면, 챗지피티나 Claude에 붙여 넣을 수 있는 재구현용 프롬프트를 만들어준다. 보통 화면 일부를 다시 만들려면 스크린샷을 붙이거나 DOM을 크게 복사해야 하는데, 스크린샷은 스타일 정보가 빠지고 DOM은 너무 길며 추적용 속성 같은 불필요한 내용이 많다. 이 도구는 선택한 요소의 정리된 HTML과 실제로 필요한 계산된 스타일만 담아 프롬프트를 만든다.

, Vue, , 일반 HTML 중 원하는 방식으로 다시 만들도록 요청할 수 있다. 핵심 방식은 부모 요소와 다른 스타일만 남기는 것이다. 그래서 불필요한 내용이 줄고, 프롬프트가 너무 길어지는 문제도 줄어든다.

붙여 넣기 전에 대략적인 토큰 수를 보여주며, 가입이나 추적 없이 브라우저 안에서만 작동한다. 현재는 북마클릿으로 쓸 수 있고, 은 심사 중이다.

핵심 포인트

  • 웹페이지에서 요소 하나를 클릭하면 재구현용 프롬프트를 만든다.
  • 정리된 HTML과 필요한 계산된 스타일을 함께 담는다.
  • 부모 요소와 다른 스타일만 남겨 프롬프트 길이를 줄인다.
  • , Vue, , 일반 HTML 같은 출력 방식을 고를 수 있다.
  • 가입과 추적 없이 브라우저에서 작동하며 현재 북마클릿으로 제공된다.
원문 보기