liminfo

Image Cropper

이미지 자르기

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

파일 선택

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

Image Cropper 소개

이미지 자르기 도구는 프리셋 비율 또는 사용자 지정 픽셀 좌표를 사용하여 이미지를 정확한 크기로 자를 수 있는 브라우저 기반 도구입니다. 6가지 비율 프리셋을 제공합니다: 자유(비율 제한 없음), 1:1(정사각형, 프로필 사진에 적합), 16:9(와이드스크린, YouTube 썸네일과 프레젠테이션에 이상적), 9:16(세로, 인스타그램 스토리와 TikTok용), 4:3(표준 디스플레이 비율), 3:2(클래식 사진 비율). X, Y, 너비, 높이 값을 직접 입력하여 픽셀 단위의 정밀한 자르기도 가능합니다.

자르기 작업은 HTML5 Canvas API의 drawImage() 메서드를 소스 사각형 매개변수(cropX, cropY, cropW, cropH)와 함께 사용하여 원본 이미지에서 지정된 영역을 추출합니다. 비율 프리셋을 선택하면 이미지 중앙에서 가장 큰 자르기 영역을 자동 계산합니다: 원본이 목표 비율보다 넓으면 높이를 기준으로 제한하고 가로 중앙 정렬하며, 좁으면 너비를 기준으로 제한하고 세로 중앙 정렬합니다.

모든 처리는 Canvas API를 사용하여 클라이언트 사이드에서 이루어집니다. 원본 이미지 해상도를 표시하고 자른 영역의 실시간 미리보기를 제공하며, 결과물은 PNG(JPEG 이외 원본) 또는 JPEG(원본이 JPEG인 경우)로 다운로드할 수 있습니다. 다운로드 파일명에는 자르기 크기가 포함됩니다(예: "cropped_800x600.png"). 최대 50MB 파일을 드래그 앤 드롭 또는 파일 선택으로 업로드할 수 있습니다.

주요 기능

  • 6가지 비율 프리셋: 자유, 1:1(정사각형), 16:9(와이드스크린), 9:16(세로), 4:3(표준), 3:2(사진)
  • 픽셀 단위 자르기 컨트롤: X 오프셋, Y 오프셋, 너비, 높이를 최소/최대 검증과 함께 조절
  • 자동 중앙 정렬 계산: 프리셋 선택 시 목표 비율에 맞는 가장 큰 중앙 영역을 자동 산출
  • HTML5 Canvas drawImage()와 소스 사각형 매개변수를 사용한 정확한 픽셀 수준 영역 추출
  • 나란한 미리보기: 원본 이미지와 자르기 결과를 크기 라벨(W x H px)과 함께 표시
  • 스마트 출력 형식: JPEG 입력은 JPEG 유지, 나머지 형식은 PNG로 출력
  • JPG, PNG, WebP 등 브라우저 호환 이미지 형식(최대 50MB) 드래그 앤 드롭 업로드
  • 100% 클라이언트 사이드 처리 — 이미지 데이터가 서버에 업로드되지 않음

자주 묻는 질문

어떤 비율 프리셋을 사용할 수 있나요?

6가지 프리셋을 제공합니다: 자유(비율 제한 없이 자유롭게 자르기), 1:1(정사각형, 프로필 사진이나 앱 아이콘에 적합), 16:9(와이드스크린, YouTube 썸네일, 프레젠테이션, 최신 디스플레이 표준), 9:16(세로, 인스타그램 스토리, TikTok, 모바일 배경화면에 이상적), 4:3(구형 모니터와 일부 카메라의 전통적 비율), 3:2(대부분의 DSLR 카메라에서 사용하는 클래식 사진 비율).

비율 자동 계산은 어떻게 동작하나요?

프리셋을 선택하면 원본 이미지의 가로/세로 비율과 목표 비율을 비교합니다. 이미지가 목표 비율보다 넓으면 자르기 높이를 이미지 전체 높이로 설정하고 너비를 높이*비율로 계산하여 가로 중앙 정렬합니다. 반대로 좁으면 자르기 너비를 전체 너비로 설정하고 높이를 너비/비율로 계산하여 세로 중앙 정렬합니다. 이렇게 선택한 비율에서 가능한 가장 큰 자르기 영역을 제공합니다.

정확한 자르기 좌표를 직접 입력할 수 있나요?

네. X(왼쪽 가장자리로부터의 수평 오프셋), Y(상단 가장자리로부터의 수직 오프셋), 너비(자르기 너비, 픽셀), 높이(자르기 높이, 픽셀) 4개의 숫자 입력 필드를 제공합니다. 각 필드에는 이미지 범위를 벗어나지 않도록 최소/최대 검증이 적용됩니다. 프리셋을 먼저 선택한 후 X, Y 오프셋을 미세 조정하여 자르기 영역을 재배치할 수도 있습니다.

어떤 이미지 형식을 자를 수 있나요?

JPG/JPEG, PNG, WebP, BMP, GIF, SVG 등 브라우저가 표시할 수 있는 모든 이미지 형식을 입력으로 받습니다. 출력 형식의 경우 JPEG 원본은 호환성을 위해 JPEG로 저장되고, 나머지 형식은 모두 PNG로 저장됩니다. 출력 파일명은 "cropped_{너비}x{높이}.jpg" 또는 "cropped_{너비}x{높이}.png"로 자동 지정됩니다.

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

최대 50MB까지의 이미지 파일을 지원합니다. 자르기가 브라우저의 Canvas API를 사용하므로 실질적 한계는 기기의 가용 메모리에 따라 달라집니다. 이미지는 원본 해상도(naturalWidth x naturalHeight)로 로드되며 자르기 영역이 원본 품질로 추출되므로, 매우 고해상도 이미지(예: 2000만 화소 이상의 카메라 사진)는 더 많은 메모리가 필요할 수 있습니다.

자르기 미리보기는 어떻게 작동하나요?

"미리보기" 버튼을 클릭하면 다운로드 없이 자른 결과를 확인할 수 있습니다. 자르기 크기(cropW x cropH)의 새 Canvas를 생성하고, drawImage()의 소스 사각형 매개변수로 원본에서 선택 영역을 그린 후 블롭 URL로 변환하여 표시합니다. 결과는 원본 이미지 옆에 자르기 크기 라벨(예: "800 x 600px")과 함께 나타납니다.

자르기 시 이미지 품질이 보존되나요?

네. 자르기 작업은 Canvas drawImage()를 사용하여 원본 전체 해상도 이미지에서 직접 픽셀을 추출합니다. 크기 조정(스케일링)이나 리샘플링이 일어나지 않으므로 자른 영역은 원본의 해당 부분과 정확히 동일한 픽셀 품질을 가집니다. JPEG 출력에는 브라우저의 표준 JPEG 인코딩 품질이 적용되고, PNG 출력은 완전 무손실입니다.

이미지 데이터가 서버로 업로드되나요?

아닙니다. 모든 처리는 브라우저 내에서만 이루어집니다. 이미지는 URL.createObjectURL()로 로컬 블롭 참조를 생성하여 로드하고, 오프스크린 Canvas에서 자르기를 수행한 후 결과를 로컬 블롭 URL로 생성합니다. 이미지 데이터는 네트워크를 통해 전혀 전송되지 않으며, 이미지는 사용자의 기기에서 완전히 비공개로 유지됩니다.