이미지 위에 이미지를 올리세요 - 오버레이, 겹치기, 레이어.

먼저 배경 이미지를 업로드하세요 - 이것이 베이스 레이어가 됩니다. 그다음 위에 올릴 이미지를 업로드하세요. 오버레이는 기본적으로 베이스 이미지의 왼쪽 위에 나타납니다. 미리보기 영역에서 드래그해 위치를 바꾸고, 배율 슬라이더로 키우거나 줄이고, 배경이 비치게 하려면 불투명도를 조절하세요. 프리셋 버튼(중앙, 오른쪽 아래, 베이스에 맞춤)으로 수동 드래그 없이 빠르게 배치할 수 있습니다. 파일을 올리는 대신 클립보드에서 이미지를 붙여넣을 수도 있습니다. 배치가 맞으면 다운로드를 클릭하세요. 전체 과정은 Canvas API로 브라우저에서 실행되며, 두 이미지는 기기에 남고 서버로 업로드되지 않으며, 일반적인 3000x2000 픽셀 사진 기준으로 1초 안에 합성됩니다.

사진에 사진을 추가하든, 이미지 위에 이미지를 올리든, 다른 그림 안에 그림을 넣든, 사진에 로고를 추가하든 과정은 같습니다. 배경을 첫 번째 이미지로 업로드한 뒤, 위에 올릴 것을 두 번째 이미지로 업로드하세요. 도구는 선택한 위치에서 두 번째 이미지를 첫 번째 위에 그립니다. 목업 프레임에 제품 샷을 넣는 것처럼 특정 지점에 이미지를 넣고 싶다면, 오버레이를 정확한 위치까지 드래그하고 맞게 배율을 조절하세요. 이 이미지 오버레이 도구는 사진 위 사진, 제품 사진 위 로고, 셀피 위 스티커, 배경 위 텍스트 이미지 등 모든 조합을 처리합니다.

병합(합치기 또는 결합이라고도 함)은 이미지를 나란히 또는 위아래로 쌓아 하나의 출력으로 만듭니다 - 결과는 어느 입력 이미지보다 넓거나 높습니다. 500x500 사진 두 장을 세로로 병합하면 500x1000 출력이 됩니다. 오버레이(슈퍼임포즈 또는 포토 레이어링이라고도 함)는 베이스 이미지 치수 안의 특정 위치에 다른 이미지를 올리므로, 출력 크기는 베이스와 같습니다. 1000x1000 베이스 위의 500x500 오버레이도 여전히 1000x1000 출력을 만듭니다. 전후 비교, 포토 콜라주, 나란히 배치 레이아웃에는 <a href="/ko/" class="text-link underline decoration-hairline underline-offset-4 hover:text-link-deep">병합 도구</a>를 사용하세요. 사진 위에 사진을 올리거나, 갤러리 이미지에 그래픽 워터마크를 추가하거나, 장면 위 특정 위치에 이미지를 넣어야 할 때는 이 오버레이 도구를 사용하세요.

네, 그리고 이것이 이 도구에서 가장 유용한 시나리오입니다. 투명 배경이 있는 PNG 로고, 아이콘 또는 오버레이 PNG를 오버레이 이미지로 업로드하세요. 보이는 픽셀만 베이스 위에 그려지고, 투명 영역은 흰 사각형 없이 배경을 깔끔하게 비춥니다. 이커머스 판매자가 제품 사진에 회사 로고를 추가하고, 사진가가 갤러리에 워터마크 서명을 올리고, 디자이너가 초상화 위에 장식 프레임을 레이어하는 방식이 바로 이것입니다. 오버레이 PNG에 아직 투명도가 없다면 remove.bg나 Photoshop 같은 도구로 먼저 배경을 제거한 뒤 알파 채널이 있는 PNG로 저장하고 여기서 오버레이하세요. JPG 오버레이는 투명도가 없어 항상 베이스 위 불투명 사각형으로 그려지며 아래를 가립니다.

미리보기 아래의 배율 슬라이더를 사용하세요. 100%에서 오버레이는 베이스 이미지 대비 원래 픽셀 크기로 렌더링됩니다. 왼쪽으로 드래그하면 5%까지 줄이고, 오른쪽으로 드래그하면 300%까지 키울 수 있습니다. 2000x1500 오버레이를 50% 배율로 하면 베이스에서 1000x750 픽셀로 렌더링됩니다. 제품 사진에 로고를 올릴 때는 베이스 이미지 너비의 10-25%가 대부분의 경우에 잘 맞습니다 - 너비 2000px 사진 위 200px 로고는 10%이며 은은한 브랜드 마크로 읽힙니다. 텍스처, 라이트 릭, 그레인 효과처럼 전체 이미지 오버레이에는 "베이스에 맞춤" 버튼을 클릭해 오버레이가 배경 전체를 덮도록 자동 배율 조정하고 중앙에 배치하세요. 배율 계산은 표시 크기가 아니라 오버레이의 자연 치수를 사용합니다.

불투명도는 오버레이 이미지가 베이스 위에서 얼마나 투명하게 보이는지를 제어합니다. 100%에서는 오버레이가 완전히 불투명하여 아래 베이스 이미지 픽셀을 완전히 덮습니다. 50%에서는 오버레이가 반투명하고 베이스가 절반 강도로 비칩니다 - 이것이 이중 노출 블렌드 효과를 만듭니다. 10%에서는 오버레이가 거의 보이지 않고 희미한 인상만 남습니다. 일반적인 설정: 마크는 보이되 사진을 지배하면 안 되는 워터마크에는 20-40%; 초상화와 풍경을 섞는 이중 노출 합성에는 50%; 베이스를 압도하지 않으면서 개성을 더하는 필름 그레인, 라이트 릭, 보케 효과 같은 텍스처 오버레이에는 15-30%; 완전한 가시성이 목표인 로고 배치, 스티커, 배지에는 100%.

네, 어떤 휴대폰에서든 온라인으로 사진을 겹칠 수 있습니다. Safari, Chrome 또는 최신 모바일 브라우저에서 이 페이지를 여세요. 첫 번째 업로드 영역을 탭해 카메라 롤에서 베이스 이미지를 고르고, 두 번째 업로드 영역을 탭해 오버레이를 고르세요. 이미지를 복사했다면 클립보드에서 붙여넣을 수도 있습니다. 손가락으로 미리보기를 드래그해 오버레이 위치를 바꾸세요. 배율, 불투명도, 위치 슬라이더는 모두 터치 입력에 반응합니다. 중앙, 오른쪽 아래 같은 프리셋 버튼은 한 번 탭으로 동작합니다. 처리는 데스크톱과 같은 이미지 오버레이 엔진으로 휴대폰에서 전부 이루어집니다 - 이미지 데이터는 서버로 전송되지 않으며 결과는 기기에 바로 다운로드됩니다. RAM 4GB 이상 휴대폰은 4000x3000까지 문제없이 처리합니다.

두 이미지를 오버레이하거나 온라인으로 사진을 겹치려면 먼저 배경 이미지를 업로드한 뒤 전경 이미지를 업로드하세요. 도구는 두 번째 이미지를 첫 번째 위에 그립니다. 투명도와 함께 온라인으로 이미지를 오버레이하려면 투명 배경 PNG 오버레이를 사용하세요. 전체를 덮는 온라인 사진 오버레이에는 "베이스에 맞춤"을 클릭해 오버레이를 배경 전체에 늘리세요. 부분 불투명도로 이미지 2장을 겹쳐 이중 노출 느낌도 낼 수 있습니다. 이미지 오버레이 방법, 사진 오버레이 방법, 그림 오버레이 방법, 온라인 이미지 오버레이를 검색해도 Canvas API 작업은 동일합니다.

오버레이가 투명도를 쓰고 출력에서도 그 투명도를 유지해야 하면 PNG로 내보내세요 - 예를 들어 베이스 이미지 자체에 투명 영역이 있거나, 합성 결과가 Figma, Photoshop, Canva처럼 깨끗한 알파 가장자리가 필요한 다른 디자인 도구로 들어갈 때입니다. PNG는 무손실이라 압축 아티팩트가 없지만 파일은 JPG보다 3-5배 큽니다. 파일 크기가 중요하고 투명도가 필요 없으면 JPG로 내보내세요. 품질 92%(기본값) JPG는 사진에서 원본과 시각적으로 동일한 결과를 내며, 2000x1500 합성 기준 대략 200-400KB입니다. 소셜 미디어 업로드, 제품 리스팅 이미지, 웹 페이지, 이메일 첨부, 이미지가 단색 배경 위에 있는 모든 맥락에는 JPG를 사용하세요.

아니요. 두 이미지는 HTML5 Canvas API와 JavaScript로 브라우저 메모리에 로드됩니다. 합성 단계 - 지정된 위치와 지정된 불투명도로 베이스 위에 오버레이를 그리는 작업 - 는 투명도 제어용 globalAlpha와 함께 canvas.drawImage()를 사용해 기기에서 전부 이루어집니다. 확인할 수 있습니다: 브라우저 개발자 도구(F12)를 열고 네트워크 탭으로 전환한 뒤 전체 오버레이 작업을 수행하세요. 이미지 데이터를 실어 나르는 송신 요청은 0입니다. 유일한 네트워크 트래픽은 초기 페이지 로드입니다. 탭을 닫으면 모든 이미지 데이터가 즉시 메모리에서 해제됩니다. 이 픽처 인 픽처 에디터는 로컬에서 실행되므로 기밀 문서, 미공개 제품 사진, 개인 이미지, 제3자 서버에 두고 싶지 않은 모든 콘텐츠에 안전합니다.