전후 비교 이미지 생성기

언제 사용하나요?

리터칭 전후, 시공 전후, UI 개선 전후를 블로그나 보고서에 한 장으로 보여줘야 할 때 사용합니다.

사용 방법

• Before 이미지와 After 이미지를 선택합니다.
• 좌우 또는 상하 배치를 고릅니다.
• 라벨 표시 여부를 정하고 결과를 다운로드합니다.

입력값 안내

비교할 두 이미지와 출력 가로 크기, 배치 방향, 배경색, 라벨 표시 여부를 입력합니다.

계산·변환 기준

두 이미지를 동일한 패널 크기에 cover 방식으로 맞춘 뒤 중앙 구분선과 선택적 라벨을 추가합니다.

사용 예시

• 변화 비교 - 두 상태의 이미지를 한 장으로 명확하게 비교합니다.
• 업로드 전 이미지 준비 - 작업 결과를 미리 확인한 뒤 블로그, 쇼핑몰, SNS에 올릴 이미지 파일을 정리합니다.
• 작업 결과 비교 - 원본과 결과 이미지를 나란히 확인하며 품질과 용량, 표시 상태를 점검합니다.

예시

• 보정 전 사진과 보정 후 사진을 좌우로 합쳐 블로그 본문 이미지 생성
• 리모델링 전후 사진을 상하로 합쳐 비교 이미지 생성

주의사항

• 브라우저 캔버스를 이용해 이미지를 처리하므로 원본 메타데이터(EXIF)가 손실되거나 투명 영역 색상이 변할 수 있습니다.
• 브라우저 환경의 이미지 디코딩 용량 한계로 인해, 지나치게 해상도가 높은 대용량 원본 파일의 변환은 실패할 수 있습니다.

자주 묻는 질문

이미지 비율이 달라도 되나요?

네, 각 패널을 채우도록 자동으로 맞춰 그립니다.

비교할 두 이미지가 서버로 전송되나요?

아니요. 두 이미지 합성은 브라우저 안에서 처리되어 외부로 올라가지 않습니다.

두 이미지 크기가 달라도 되나요?

네. 각 패널 크기에 맞춰 자동으로 맞춰 그리므로 비율이 다른 사진도 비교 이미지로 합칠 수 있습니다.

좌우와 상하 배치를 고를 수 있나요?

두 이미지를 좌우로 나란히 두거나 위아래로 쌓는 배치를 선택할 수 있어 비교 게시물에 맞게 만들 수 있습니다.

관련 도구

• 이미지 그리드 합치기 - 여러 이미지를 격자 형태로 하나의 PNG 이미지로 합칩니다.
• 이미지 여백 추가 - 이미지 주변에 원하는 색상의 여백을 추가합니다.
• 이미지 워터마크 추가 - 이미지 위에 텍스트나 로고 워터마크를 위치와 투명도까지 조절해 추가합니다.
• 썸네일 생성기 - 텍스트와 배경색으로 간단한 1280×720 썸네일 이미지를 만듭니다.
• 이미지 리사이즈 - 여러 이미지를 서버 업로드 없이 브라우저에서 비율을 유지하며 리사이즈합니다. JPEG·PNG·WebP 등을 지원하며 최대 가로·세로 픽셀을 지정하면 해상도가 일괄 축소됩니다.
• 이미지 크롭 - 픽셀 좌표를 입력해 이미지의 필요한 영역만 브라우저에서 잘라냅니다.