이미지 자르기
SNS 비율 프리셋 + 자유 크롭 + 회전 — 인스타·유튜브·릴스·틱톡 비율 한 번에.
사진이 외부 서버로 전송되지 않습니다. 모든 처리는 사용자 브라우저의 canvas API에서 이루어집니다.
—
[ AdSense 광고 자리 ]
SNS·플랫폼별 권장 비율
| 플랫폼 | 용도 | 권장 비율 |
|---|---|---|
| 인스타그램 | 피드 정사각 | 1:1 |
| 인스타그램 | 릴스·스토리 | 9:16 |
| 유튜브 | 썸네일·가로 영상 | 16:9 |
| 유튜브 | 쇼츠 | 9:16 |
| 틱톡 | 세로 영상 | 9:16 |
| 트위터(X) | 이미지 | 16:9 또는 1:1 |
| 페이스북 | 피드 가로 | 1.91:1 (16:9 근사) |
| DSLR·필름 카메라 | 일반 사진 | 3:2 |
| 프린트 사진 | 4×6인치 | 3:2 |
| 프린트 사진 | 5×7인치 | 약 4:5 |
관련 도구
핸들이 작아서 모바일에서 어려워요
핸들 8개(모서리 4 + 변 4)는 14×14px이지만 터치 영역은 +8px 패딩이 잡혀있어 약 30×30 영역 안에서 동작합니다. 그래도 정밀하게 맞추기 어려우면 가운데 사각형 안쪽을 드래그하면 위치만 조정 가능합니다. 큰 화면 추천.
비율을 고정해도 이상한 크기가 나오는데?
드래그가 끝난 위치 기준으로 비율 안에서 가장 큰 사각형으로 자동 정렬됩니다. 비율 변경 시 현재 위치 가운데를 기준으로 다시 그려지므로 한 번 비율 고정 후 미세 조정 권장.
회전 후 크롭이 어색해요
회전이 적용되면 이미지 자체가 새 캔버스로 다시 그려지고 크롭 영역도 자동으로 재설정됩니다. 회전·반전을 먼저 모두 적용한 후 크롭 영역을 잡는 흐름을 추천합니다.
brower·canvas API로 어디까지 되나요?
모든 자르기·회전·인코딩이 Canvas 2D API의
drawImage·toBlob으로만 동작합니다. 외부 라이브러리·서버 의존 없음. 브라우저가 지원하는 모든 이미지 포맷 입력 가능, 출력은 JPG/PNG/WebP.
자주 묻는 질문
사진이 외부 서버로 업로드되나요?
전송되지 않습니다. 자르기는 브라우저의 canvas API에서만 처리되며, 사이트 운영자도 사진 내용을 볼 수 없습니다.
가족·여행·민감 사진도 안심하고 사용하세요.
비율 프리셋은 어떤 게 있나요?
자유 / 1:1(인스타·프로필) / 4:3(일반 카메라) / 16:9(유튜브 썸네일·가로 영상) / 9:16(릴스·틱톡·세로 영상) / 3:2(DSLR·필름) / 4:5(인스타 세로) 7종.
비율 고정 시 핸들이 비율을 유지한 채로만 움직입니다.
SNS별 권장 비율은?
인스타 게시물 정사각 = 1:1, 릴스·스토리·틱톡·쇼츠 = 9:16, 유튜브 가로 = 16:9, 트위터(X) = 16:9 또는 1:1, 페이스북 게시물 = 1.91:1.
위쪽 표 참고.
회전은 어떻게 되나요?
0·90·180·270도 회전 + 좌우/상하 반전 지원. 회전이 적용된 상태에서 자르기를 하면 회전된 결과가 출력됩니다.
iPhone 사진이 옆으로 누워 있을 때 90도 회전 후 크롭하면 편리합니다.
큰 이미지도 처리되나요?
일반 사진(20MB 이하)은 데스크톱·모바일 모두 무난. 매우 큰 이미지(50MB+, 1억 픽셀+)는 브라우저 메모리 한계로 느려질 수 있으니
먼저 이미지 리사이즈로 가로 4000~5000px로 줄인 후 자르기를 권장합니다.
출력 화질이 떨어지나요?
PNG·WebP는 무손실, JPG는 품질 슬라이더로 조정(기본 90). 자르기는 픽셀 영역을 그대로 추출하므로 추가 화질 손실 없음.
단 회전을 사용하면 픽셀 보간이 일어나 미세한 흐림이 생길 수 있는데 90·180·270도는 픽셀 정렬이 정확해 손실 없습니다.
참고
최종 검증: 2026-05-06 / Canvas API + drag&drop UX 직접 구현.
⚠️ 자르기 후 결과 이미지 크기·해상도가 의도한 대로인지 확인. SNS 업로드 전에는 각 플랫폼의 최신 권장값을 다시 확인하세요(가이드라인은 종종 변경됨).