비율을 구하는 법
가로와 세로의 최대공약수로 양쪽을 나누면 기약 비율이 나옵니다. 1920×1080은 최대공약수 120으로 나눠 16:9입니다. 1366×768처럼 최대공약수가 작으면 683:384 같은 낯선 숫자가 나오는데, 소수로 1.779라서 16:9(1.778)와 사실상 같습니다. 이 도구는 기약 비율과 함께 가장 가까운 표준 비율, 그리고 오차를 보여주므로 "거의 16:9"인지 확인할 수 있습니다.
한 변 고정 리사이즈
비율을 유지하며 크기를 바꾸려면 새 가로 ÷ 원본 가로 = 새 세로 ÷ 원본 세로 관계를 쓰면 됩니다. 1920×1080을 가로 1280으로 줄이면 세로는 1080 × 1280/1920 = 720입니다. 결과가 정수로 떨어지지 않으면 반올림해야 하는데, 영상은 가로·세로 모두 짝수여야 하는 코덱이 많아(H.264) 2의 배수로 맞추는 편이 안전합니다. 가로·세로를 모두 지정해 비율이 달라지면 여백을 두는 contain(레터박스)이나 잘라내는 cover 중 하나를 골라야 하며, CSS object-fit이나 편집 프로그램의 "맞추기/채우기"가 이에 해당합니다.
CSS에서 비율 유지
최신 브라우저는 aspect-ratio: 16 / 9 속성으로 요소 비율을 고정할 수 있습니다. 구형 브라우저 대응이 필요하면 padding-top 트릭을 씁니다. 높이 0인 요소에 padding-top: 56.25%(9/16)를 주면 너비에 비례하는 높이가 생기고, 내부 요소를 absolute로 채웁니다. 이 도구의 "세로/가로 %" 값이 그 padding-top 값입니다.
플랫폼 규격 고를 때
SNS는 업로드 이미지를 자체 규격으로 다시 압축·축소하므로 권장 크기의 정확히 1배 또는 2배로 만드는 것이 가장 깨끗합니다. 인스타그램 피드는 4:5(1080×1350)가 화면을 가장 많이 차지하고, 1:1은 안전하며, 16:9 가로 이미지는 작게 보입니다. 링크 미리보기(OG 이미지)는 페이스북·링크드인·슬랙이 1.91:1(1200×630), 카카오톡은 2:1(800×400)을 기준으로 잘라내므로 두 비율 모두에서 잘리지 않게 중앙에 핵심을 두는 것이 좋습니다. 유튜브 썸네일은 1280×720이 권장이고 최소 640px 너비를 요구합니다.
자주 묻는 질문
1366×768은 왜 16:9가 아니라 683:384로 나오나요?
기약 비율은 정확한 정수 비율이라 그렇습니다. 소수로는 1.779로 16:9(1.778)와 0.1% 차이이며, 실무에서는 16:9로 취급합니다. 결과의 "≈ 16:9" 표시를 보세요.
세로 결과가 소수로 나오면요?
픽셀은 정수이므로 반올림합니다. 영상은 짝수로, 아이콘·스프라이트는 원본 비율이 조금 달라져도 정수 크기를 우선하는 것이 보통입니다.
4:3 사진을 16:9 화면에 꽉 채우려면?
비율이 다르므로 위아래를 잘라내야(cover) 합니다. 새 가로·세로를 모두 넣으면 얼마나 잘리는지 계산해 줍니다. 잘리는 것이 싫으면 contain으로 좌우 여백을 둡니다.