본문으로 건너뛰기

이미지 크롭

이미지를 원하는 비율과 위치로 자르는 도구입니다. 소셜 미디어 게시물, 프로필 사진, 썸네일 제작에 유용합니다.

💡 Tips for Best Results

  • Aspect Ratio: Select ratio based on your use case (1:1 for Instagram, 16:9 for videos)
  • Position: Choose where to focus the crop (center is most common)
  • Free Crop: Maintains original aspect ratio with 80% of image
  • Quality: Cropping doesn't reduce quality, only removes parts of the image
  • Privacy: All processing happens in your browser - no uploads to server

주요 기능​

  • 다양한 화면 비율 선택
  • 자유 크롭 (Free) 또는 고정 비율
  • 5가지 크롭 위치 (중앙, 상단, 하단, 좌측, 우측)
  • 실시간 미리보기
  • 고품질 출력
  • 브라우저에서 직접 처리

화면 비율 (Aspect Ratio)​

지원하는 비율​

Free (자유)​

  • 제한 없이 원하는 영역 선택
  • 드래그로 크기 조절 가능
  • 완전 자유로운 크롭

1:1 (Square)​

  • 정사각형
  • 용도: Instagram 게시물, 프로필 사진, 썸네일
  • 플랫폼: Instagram, Facebook, Twitter 프로필

4:3​

  • 가로 4, 세로 3
  • 용도: 일반 사진, 프레젠테이션
  • 플랫폼: 전통적인 디스플레이 비율

16:9​

  • 와이드스크린
  • 용도: YouTube 썸네일, 웹사이트 배너, TV/모니터
  • 플랫폼: YouTube, 비디오 콘텐츠

9:16 (Story)​

  • 세로형 (16:9의 반대)
  • 용도: Instagram/Facebook 스토리, Reels, TikTok
  • 플랫폼: 모바일 전용 콘텐츠

4:5 (Instagram)​

  • 세로형
  • 용도: Instagram 피드 게시물
  • 플랫폼: Instagram 세로 사진 최적 비율

크롭 위치​

위치 옵션​

Center (중앙)​

  • 이미지 중앙을 기준으로 크롭
  • 가장 일반적인 선택
  • 피사체가 중앙에 있을 때 적합

Top (상단)​

  • 이미지 상단을 기준으로 크롭
  • 하늘, 배경이 중요한 경우
  • 상단 정렬이 필요한 경우

Bottom (하단)​

  • 이미지 하단을 기준으로 크롭
  • 하단 내용이 중요한 경우
  • 하단 정렬이 필요한 경우

Left (좌측)​

  • 이미지 좌측을 기준으로 크롭
  • 좌측 정렬이 필요한 경우
  • 좌측 콘텐츠가 중요한 경우

Right (우측)​

  • 이미지 우측을 기준으로 크롭
  • 우측 정렬이 필요한 경우
  • 우측 콘텐츠가 중요한 경우

사용 시나리오​

1. Instagram 게시물​

비율: 1:1 (Square) 또는 4:5 (Instagram)
위치: Center
용도: 피드 게시물 최적화

2. Instagram/Facebook 스토리​

비율: 9:16 (Story)
위치: Center
용도: 세로형 스토리 콘텐츠

3. YouTube 썸네일​

비율: 16:9
위치: Center
용도: 동영상 썸네일 (1280×720px)

4. 프로필 사진​

비율: 1:1 (Square)
위치: Center
용도: 소셜 미디어 프로필 이미지

5. 웹사이트 배너​

비율: 16:9
위치: Center 또는 Top
용도: 히어로 이미지, 배너

6. TikTok/Reels​

비율: 9:16 (Story)
위치: Center
용도: 세로형 짧은 동영상 썸네일

지원 형식​

  • 입력: PNG, JPG, JPEG, WebP
  • 출력: PNG (고품질)
  • 최대 크기: 50MB
  • 출력 품질: 무손실 (Lossless)

크롭 팁​

플랫폼별 권장 비율​

Instagram​

  • 피드 게시물: 1:1 (Square) 또는 4:5
  • 스토리: 9:16 (1080×1920px)
  • 프로필: 1:1 (320×320px)
  • Reels: 9:16

YouTube​

  • 썸네일: 16:9 (1280×720px)
  • 채널 아트: 16:9 (2560×1440px)
  • 프로필: 1:1

Facebook​

  • 게시물: 1:1 또는 4:5
  • 커버 사진: 16:9 (820×312px)
  • 스토리: 9:16
  • 프로필: 1:1

Twitter​

  • 게시물: 16:9 (1200×675px)
  • 헤더: 3:1 (1500×500px)
  • 프로필: 1:1

TikTok​

  • 동영상: 9:16 (1080×1920px)
  • 프로필: 1:1

크롭 시 주의사항​

피사체 배치​

  • 중요한 요소가 잘리지 않도록 주의
  • 인물 사진: 머리와 어깨가 포함되도록
  • 제품 사진: 전체가 보이도록

여백 확보​

  • 텍스트 추가 예정: 충분한 여백 확보
  • 소셜 미디어: 로고나 아이콘이 가려지지 않도록
  • 안전 영역: 가장자리 10% 여백 권장

해상도 고려​

  • 크롭 후 해상도가 너무 낮아지지 않도록
  • 최소 해상도: 1080px (긴 쪽 기준)
  • 고해상도 원본 사용 권장

기술 정보​

크롭 방식​

  • Canvas API: HTML5 Canvas를 사용한 이미지 크롭
  • 클라이언트 사이드: 브라우저에서 직접 처리
  • 고품질 렌더링: 원본 해상도 유지
  • 무손실 처리: PNG 형식으로 저장

프라이버시​

  • ✅ 모든 처리가 브라우저에서 진행
  • ✅ 서버로 이미지 업로드되지 않음
  • ✅ 100% 클라이언트 사이드 처리
  • ✅ 인터넷 연결 없이도 작동 (페이지 로드 후)

크롭 알고리즘​

  1. 이미지 로드: FileReader API로 원본 이미지 읽기
  2. 비율 계산: 선택된 화면 비율에 따라 크롭 영역 계산
  3. 위치 설정: 크롭 위치에 따라 x, y 좌표 계산
  4. Canvas 생성: 크롭 크기의 Canvas 생성
  5. 이미지 추출: drawImage()로 선택 영역만 추출
  6. 출력 생성: toBlob()으로 PNG 파일 생성

자주 묻는 질문​

Q: 크롭 후 해상도가 낮아지나요?​

A: 원본 해상도를 유지하여 크롭합니다. 다만 크롭 영역이 작으면 최종 이미지 크기도 작아집니다.

Q: 여러 이미지를 한 번에 크롭할 수 있나요?​

A: 현재는 한 번에 한 이미지만 처리 가능합니다. 각 이미지를 순서대로 크롭하세요.

Q: 자유롭게 영역을 선택하고 싶어요.​

A: "Free" 비율을 선택하면 제한 없이 원하는 영역을 선택할 수 있습니다.

Q: 크롭 미리보기가 실제 결과와 다른가요?​

A: 미리보기는 실제 결과와 동일합니다. 다운로드한 이미지가 미리보기와 같습니다.

관련 도구​

브라우저 지원​

  • ✅ Chrome 50+
  • ✅ Firefox 50+
  • ✅ Safari 11+
  • ✅ Edge 79+
  • ✅ 모바일 브라우저 (iOS Safari, Chrome Mobile)