01 / Chrome
보이는 그대로 캡처
수정할 페이지를 열고 Chrome 도구 모음의 Snapture를 눌러 캡처할 범위를 고르세요.
웹 화면을
편집 가능한 Figma로
로그인한 화면도 캡처해서 텍스트와 레이아웃을 직접 수정하세요.
매월 캡처 10회 무료. 매달 초기화됩니다.
기능
현재 화면을 다음 수정안의 출발점으로
02 / HTML + CSS
HTML과 CSS에서도
코드를 미리 보고 폭을 조정한 뒤 캡처하세요.
03 / Figma
Auto Layout
원래 배치를 유지할 수 있는 영역에는 Auto Layout을 적용해 편집을 이어갑니다.
컴포넌트 & 스타일
구조가 맞는 반복 요소는 컴포넌트로 묶을 수 있습니다. 지원되는 텍스트와 색, CSS 색상 변수는 로컬 스타일과 변수로 가져옵니다.
04 / Viewport
화면 폭에 맞게
각 화면 폭에서 실제로 배치된 모습을 캡처합니다.
차트, 지도, 3D
차트, 지도, 3D 콘텐츠는 이미지로 들어올 수 있습니다. 이 영역은 차트 데이터나 3D 모델로 편집되지 않습니다.
일괄 캡처
URL을 붙여넣거나 사이트맵에서 불러오면 한 번에 최대 30개 페이지를 차례로 열어 담습니다.
사용 방법
- 01
보이는 그대로 캡처
수정할 페이지를 열고 Chrome 도구 모음의 Snapture를 눌러 캡처할 범위를 고르세요.
- 02
피그마용 복사
캡처가 끝나면 Figma용으로 복사하세요. 파일로 저장한 뒤 플러그인에 끌어다 놓을 수도 있습니다.
- 03
Figma에서 수정
Figma 파일에서 Snapture Import를 열고 Cmd/Ctrl+V로 붙여넣으세요. 텍스트 레이어를 선택해 수정을 시작할 수 있습니다.
가격
이미 존재하는 걸 다시 그리지 마세요.
먼저 Chrome 확장을 추가하세요. 캡처한 뒤 Figma에서 Snapture Import를 열어 붙여넣습니다.