피그마 MCP 안 깔고 웹페이지를 피그마로 옮기기 (Figmimic)

웹페이지를 편집 가능한 피그마 레이어로 옮기는 데 피그마 MCP를 꼭 세팅해야 하는 건 아닙니다. 북마크 하나면 됩니다. Figmimic이라는 북마클릿이고 무료입니다.

재밌는 건 둘이 같은 엔진을 씁니다. 제가 북마클릿을 뜯어보니 안에 든 캡처 코드가 피그마 MCP 서버에서 내려오는 그 파일이었습니다.

Figmimic 공식 페이지의 설치와 사용 안내. 북마클릿을 북마크바로 드래그하고, 페이지에서 클릭한 뒤 피그마에 붙여넣는 4단계

먼저 밝혀둡니다. 설치 파일과 내부 동작은 제가 직접 확인했지만, 피그마에 붙여넣은 결과물은 확인하지 못했습니다. 붙여넣기 이후 이야기는 제작자 설명과 공식 안내 기준입니다.

안에 든 게 피그마 MCP 코드입니다

북마클릿을 열어보면 캡처 엔진의 출처가 이겁니다.

https://mcp.figma.com/mcp/html-to-design/capture.js

피그마 MCP 서버 주소이고, 경로 이름이 html-to-design입니다. 직접 받아보니 402,462바이트로, 공식 페이지가 말한 「약 400KB」와 맞습니다. 호출하는 함수도 하나뿐입니다.

window.figma.captureForDesign({ selector: 'body' })

그러니까 Figmimic은 새 엔진을 만든 게 아닙니다. 피그마가 MCP용으로 만들어 둔 캡처 라이브러리를 통째로 안에 넣고 다니면서, MCP 서버를 붙이지 않고도 쓰게 포장한 것입니다.

라이브러리를 안고 다니는 이유도 여기서 나옵니다. 캡처할 페이지에서 아무것도 새로 불러오지 않으니, 보안 정책(CSP)이 빡빡한 사이트에서도 안 막힙니다.

만든 사람은 B12의 CTO Adam Marcus이고 2026년 5월에 공개했습니다. 본인이 클로드 코드로 만들었다고 밝혔습니다.

피그마 MCP랑 뭘 골라야 하나요

같은 일을 하는 길이 셋인데, 엔진은 같고 포장만 다릅니다.

  • 피그마 MCP: 커서나 클로드 코드에서 부릅니다. MCP 서버를 붙일 줄 알아야 합니다. 대신 AI에게 "이 화면 가져와서 이렇게 고쳐" 식으로 시킬 수 있습니다.
  • html.to.design: 피그마 플러그인이었고 유료였습니다. 지피터스에도 피그마 MCP로 대체되었다는 김한솔님 기록이 있습니다.
  • Figmimic: 북마크 하나. 설치할 게 없고 무료입니다. 대신 AI에게 시키는 건 안 됩니다.

이미 커서나 클로드 코드에 피그마 MCP를 붙여 쓰고 있다면 갈아탈 이유가 없습니다. AI가 화면을 읽고 고치는 데까지 이어지는 건 MCP 쪽뿐입니다.

반대로 MCP 세팅이 부담이었다면 이쪽이 가장 짧은 길입니다. 디자이너가 화면만 피그마로 가져오면 되는 경우가 그렇습니다.

스크린샷과 뭐가 다른가요

이미 나온 화면을 피그마에서 손보려 할 때 보통은 스크린샷을 찍어 붙입니다. 그러면 이미지 한 장이라 글자 하나 못 고칩니다.

Figmimic은 화면의 DOM 구조를 피그마 네이티브 포맷으로 바꿔서 넘깁니다. 붙여넣으면 프레임과 레이어 계층이 살아 있고, 요소를 클릭해 고칠 수 있습니다.

로그인해야 보이는 화면에서도 됩니다. 대시보드, 어드민, 사내 앱처럼 밖에서 주소로 접근 못 하는 화면이 특히 그렇습니다. 브라우저에 이미 떠 있는 걸 그대로 뜨는 방식이라 가능합니다.

설치는 드래그 한 번입니다

공식 페이지에서 보라색 FIGMIMIC 버튼을 북마크바로 끌어다 놓으면 끝입니다. 계정도, 확장 프로그램도 없습니다.

쓰는 순서는 이렇습니다. 옮기고 싶은 페이지를 열고, 북마크바의 Figmimic을 누르고, 「Copied」가 뜨면 피그마에서 붙여넣습니다.

북마크 하나가 449KB입니다. 피그마 캡처 라이브러리를 통째로 안고 있어서 그런데, 그래서 몇 달에 한 번은 다시 드래그해서 최신 라이브러리로 갈아줘야 합니다.

안 될 때 보는 곳

공식 안내에 적힌 네 가지입니다. 저도 테스트하다 두 번째와 세 번째를 그대로 겪었습니다.

파이어폭스에는 설치가 안 됩니다. 파이어폭스는 북마크 주소를 65,536자까지만 저장하고 넘으면 경고 없이 버립니다. 드래그가 된 것처럼 보이는데 아무것도 안 남습니다. 크롬이나 사파리를 쓰세요.

「클립보드가 거부됐다」고 나옵니다. 클립보드 쓰기는 내가 누른 동작에 묶여 있어야 하는데, 캡처가 끝나는 시점엔 그 클릭이 이미 만료된 상태입니다. 사파리가 가장 깐깐합니다. 캡처가 날아간 건 아니니 화면 아무 데나 한 번 클릭하면 그 클릭으로 복사가 진행됩니다.

「이 페이지를 클릭하세요」가 나옵니다. 페이지에 포커스가 있어야 클립보드에 쓸 수 있는데, 북마크를 누르면 포커스가 브라우저 UI에 남는 경우가 있습니다. 이것도 화면을 한 번 클릭하면 풀립니다.

이미지 일부가 빕니다. 이미지는 내려받아야 심을 수 있고, 그 다운로드를 페이지의 connect-src 정책이 통제합니다. 같은 도메인 이미지는 들어오고, 정책에 없는 외부 도메인 이미지는 빠집니다. 글자와 레이아웃, 스타일은 영향받지 않습니다.

제작자가 밝힌 한계도 있습니다. 요소가 보이고 숨는 규칙을 틀리게 잡거나 크기가 원본과 달라지는 경우를 봤다고 했고, 플로우와 인터랙션 상태, 애니메이션은 테스트해보지 않았다고 적어뒀습니다.

정리하면

  • 피그마 MCP를 이미 쓰고 있다 → 그대로 쓰세요. AI에게 시킬 수 있는 건 그쪽뿐입니다.
  • MCP 세팅이 부담이다 → Figmimic. 북마크 드래그 한 번, 무료.
  • 되는 곳: 크롬·사파리. 파이어폭스는 설치 자체가 안 됨
  • 강한 데: 로그인해야 보이는 화면, 보안 정책이 빡빡한 사이트
  • 약한 데: 외부 도메인 이미지, 인터랙션과 애니메이션
  • 안 될 때: 화면을 한 번 클릭

오픈소스는 아니고 공개된 저장소가 없습니다. 회사 화면을 뜨는 용도라면 알고 쓰시는 게 좋습니다. 다만 캡처할 페이지에서 무언가를 밖으로 보내는 구조는 아니고, 결과물은 내 클립보드로만 갑니다.

이 글은 2026년 8월 24일 기준입니다. 북마클릿이 라이브러리를 안고 다니는 구조라 피그마가 그 라이브러리를 손보면 동작이 바뀔 수 있습니다. 몇 달에 한 번 다시 드래그하라는 안내가 그래서 붙어 있습니다.