liminfo

Image Resizer

이미지 크기 조정

파일을 여기에 드래그하거나

파일 선택

JPG, PNG, WebP 등 이미지 파일 (최대 50MB)

Image Resizer 소개

이미지 크기 조절 도구는 브라우저에서 직접 이미지의 픽셀 크기를 변경할 수 있습니다. 목표 너비와 높이를 픽셀 단위로 입력하면 HTML5 Canvas API의 drawImage() 메서드를 사용하여 정확한 사양으로 이미지를 스케일링합니다. 종횡비 잠금 옵션은 한 값을 변경할 때 자동으로 대응 치수를 계산합니다.

naturalWidth와 naturalHeight 속성으로 원본 이미지 크기를 읽고, 목표 해상도의 캔버스를 생성하여 ctx.drawImage(img, 0, 0, width, height)로 스케일링된 이미지를 그립니다. 브라우저 Canvas 렌더링에 내장된 이중선형 보간 알고리즘이 부드러운 축소 및 확대 결과를 생성합니다.

JPG, PNG, WebP 이미지를 최대 50MB까지 지원합니다. canvas.toBlob()으로 원본 포맷(JPEG은 JPEG, 나머지는 PNG)을 유지하며, 나란히 미리보기로 원본과 리사이즈 결과를 비교하고, 다운로드 파일명에 새 크기가 포함됩니다(예: resized_800x600.png).

주요 기능

  • 사용자 정의 너비와 높이 값을 입력하여 정확한 픽셀 크기로 이미지 리사이즈
  • 너비 변경 시 높이를 자동 계산하는 종횡비 잠금 기능
  • 브라우저 네이티브 이중선형 보간을 적용한 Canvas API drawImage() 스케일링
  • 참조를 위한 원본 이미지 크기(naturalWidth x naturalHeight) 표시
  • 크기 레이블과 함께 원본과 리사이즈 이미지를 나란히 미리보기
  • JPEG 입력은 JPEG, 기타 포맷은 PNG로 원본 형식 유지하여 다운로드
  • 다운로드 파일명에 목표 크기 포함(예: resized_1024x768.jpg)
  • JPG, PNG, WebP 이미지 최대 50MB까지 드래그 앤 드롭 업로드 지원

자주 묻는 질문

종횡비 잠금은 어떻게 작동하나요?

종횡비 잠금이 활성화되면, 너비를 변경할 때 자동으로 높이가 newHeight = Math.round((newWidth / originalWidth) * originalHeight) 공식으로 재계산되며, 반대의 경우도 마찬가지입니다. 이는 원본 비율을 유지하여 이미지 왜곡을 방지합니다.

어떤 스케일링 알고리즘이 사용되나요?

브라우저에 내장된 Canvas 2D 렌더링을 사용하며, ctx.drawImage()를 다른 소스/타겟 크기로 호출할 때 기본적으로 이중선형 보간을 적용합니다. 이로써 확대와 축소 모두에서 부드러운 결과를 얻을 수 있습니다.

원본보다 더 크게 리사이즈할 수 있나요?

네, 원본보다 큰 크기를 입력할 수 있습니다. Canvas drawImage() 메서드가 보간을 사용하여 이미지를 확대합니다. 단, 원본의 2-3배 이상 확대하면 새로운 디테일이 생성되지 않으므로 흐릿한 결과가 나올 수 있습니다.

리사이즈하면 이미지 품질이 떨어지나요?

축소는 픽셀 수를 줄이므로 일부 디테일이 손실되지만 파일 크기가 작아집니다. Canvas 이중선형 보간이 아티팩트를 최소화합니다. PNG로 다운로드하면 압축 아티팩트가 추가되지 않으며, JPEG는 브라우저 기본 품질(약 92%)로 저장됩니다.

최대 파일 크기는 얼마인가요?

최대 50MB를 지원합니다. 모든 처리가 Canvas API를 사용하여 브라우저에서 로컬로 이루어지므로 서버 업로드 제한이 없습니다. 매우 큰 이미지는 캔버스 렌더링 시 더 많은 브라우저 메모리를 사용할 수 있습니다.

이미지가 서버로 전송되나요?

아니요. 모든 것이 클라이언트 사이드에서 실행됩니다. 이미지는 URL.createObjectURL()로 로컬 파일에서 로드되고, HTML5 Canvas에서 리사이즈되며, 결과는 브라우저 메모리에 남습니다. 어떤 데이터도 기기를 떠나지 않습니다.

소셜 미디어 규격에 맞게 리사이즈할 수 있나요?

네, 원하는 픽셀 크기를 자유롭게 입력할 수 있습니다. 주요 소셜 미디어 크기로는 1080x1080(인스타그램 정사각형), 1200x630(페이스북/트위터 링크 미리보기), 1920x1080(유튜브 썸네일), 800x800(상품 사진) 등이 있습니다. 비례하지 않는 크기는 종횡비 잠금을 해제하세요.

리사이즈된 이미지의 출력 포맷은 무엇인가요?

원본 포맷을 유지합니다. JPEG 입력은 canvas.toBlob()에서 image/jpeg MIME 타입으로 JPEG 출력을 생성하고, PNG, WebP 등은 PNG 출력을 생성합니다. 다운로드 파일명에 새 크기가 반영됩니다(예: resized_800x600.png).