Show before and after with one draggable slider

같은 크기의 이미지 두 장을 업로드하면 도구가 드래그할 수 있는 핸들과 함께 두 이미지를 겹쳐 보여 줍니다. 왼쪽으로 밀면 전(before) 이미지가, 오른쪽으로 밀면 후(after) 이미지가 나타나, 편집, 리터칭, 체중 감량, 리모델링, 디자인 반복 작업, AI 생성 결과를 보여주기에 완벽합니다.

네. 슬라이더를 스와이프 동작이 자동으로 반복 재생되는 MP4 또는 움직이는 GIF로 내보낼 수 있어, 시청자가 핸들을 드래그할 수 없는 Instagram, TikTok, X, LinkedIn 게시물에 이상적입니다. 프레임 속도와 재생 시간을 설정할 수 있습니다.

슬라이더가 픽셀 단위로 비교하므로 가능하면 그렇게 하는 것이 좋습니다. 크기가 다를 경우, 도구가 두 번째 이미지를 자동으로 잘라내거나 크기를 조정해 첫 번째 이미지에 맞추며, 가로세로 비율을 유지해 비교가 정확하게 이루어지도록 합니다.

JPEG, PNG, WebP, GIF, HEIC를 모두 지원합니다. 내보낸 영상은 최대 호환성을 위해 H.264 MP4를 사용하며, GIF 내보내기는 빠른 소셜 공유에 적합할 만큼 파일 크기를 작게 유지합니다.

나란히 비교 미리보기는 브라우저에서 이루어지지만, 합성 이미지를 내보내면 최종 파일을 렌더링하기 위해 두 이미지가 저희 보안 서버로 업로드됩니다. 이후 자동으로 삭제되며, 절대 공유되거나 모델 학습에 사용되지 않습니다. 업로드가 전혀 허용되지 않는 극비 자료의 경우, 내보내기를 사용하는 대신 화면상의 미리보기를 스크린샷으로 캡처하세요.

네. 생성된 HTML 스니펫을 복사하여 WordPress, Webflow, Squarespace, Shopify 또는 모든 정적 사이트에 붙여넣으세요. 이 임베드는 의존성이 없고 모바일 친화적이며 외부 JavaScript 라이브러리 없이도 작동합니다.

비교 패널의 방향 컨트롤을 사용해 가로(좌우 스와이프, 가로 사진과 나란히 배치에 가장 적합)와 세로(상하 스와이프, 세로로 긴 인물 사진이나 리모델링·성장 사진 같은 전후 높이 비교에 더 적합)를 전환하세요.

Split %는 이전과 이후 이미지 사이의 구분선이 위치하는 지점을 설정하며, 0(이후 전체 표시)부터 100(이전 전체 표시)까지이고 기본값은 균등 분할을 위해 50입니다. 내보내는 합성물에서 특정 이미지를 더 많이 보이게 하려면 한쪽으로 옮기세요. 예를 들어 "이후" 결과를 강조하려면 70으로 설정합니다.

비교 패널에서 교체 버튼을 클릭하면 다시 업로드하지 않고도 전후 이미지를 즉시 맞바꿀 수 있습니다. 순서를 잘못 넣었거나 다른 시각 효과를 위해 드러나는 방향을 뒤집고 싶을 때 유용합니다.

방 전체 리모델링의 경우 세로 방향에 50% 분할이 잘 어울리는데, 바닥재와 천장 변화 같은 위아래 디테일을 시청자가 비교할 수 있기 때문입니다. 나란히 놓는 가구나 색상 변화의 경우 가로 방향에 40~60% 분할(더 인상적인 결과가 있는 이미지 쪽을 우선)이 가장 효과적으로 시선을 끄는 경향이 있습니다.