화면 비율 계산기
원본 가로·세로와 새 기준 길이를 입력하세요. 1~100,000의 정수만 받습니다. 단위는 세 칸 모두 같게 사용하세요. 실제 파일을 바꾸지는 않습니다.
입력을 확인하고 계산하기를 누르세요.
미리보기는 비율을 보여 주는 축소 상자입니다. 실제 픽셀 크기나 장치 규격을 보장하지 않습니다. 소수 치수는 최근접 정수로 반올림한 대안과 비율 오차도 표시합니다.
가로를 바꾸면 세로는 얼마여야 하는가
이미지나 영상 영역의 가로를 줄이면서 세로를 그대로 두면 원래 모양이 달라질 수 있습니다. 비율을 유지하려면 같은 배율을 두 방향에 적용해야 합니다. 이 글의 계산기는 원본 가로·세로와 새 가로 또는 새 세로를 받아 나머지 치수를 계산합니다. 실제 파일을 열거나 바꾸지 않으며 저장한 이미지의 품질을 보장하는 도구도 아닙니다.
계산 영역에는 원본 가로 1920, 세로 1080과 새 가로 1280이라는 예시가 들어 있습니다. 이 숫자는 설명용 치수입니다. 계산하기를 누르면 원본 비율, 이상적인 새 치수, 배율과 최근접 정수 대안을 확인할 수 있습니다. 반올림 때문에 원래 비율에서 얼마나 달라졌는지도 별도로 표시합니다. 실제 블로그에서 버튼이 작동하는지는 저장 뒤 확인해야 합니다.
입력은 같은 단위의 양의 정수 사용
원본 두 길이와 새 기준 길이는 모두 같은 단위로 입력하세요. 픽셀을 사용할 때는 세 칸 모두 픽셀이어야 합니다. 이 계산기는 1~100,000의 정수만 받으며 소수, 단위 문자와 쉼표를 입력하는 방식은 지원하지 않습니다. 설명용으로 1,920 대신 1920을 입력합니다. 빈칸과 0도 길이로 받아들이지 않습니다.
밀리미터처럼 다른 단위를 같은 방식으로 계산할 수는 있지만 이 도구는 단위를 자동 변환하지 않습니다. 가로는 픽셀, 세로는 밀리미터인 입력은 의미 있는 비율이 아닙니다. 물리 화면의 가로·세로를 픽셀 수와 동일하게 다루려면 추가 조건이 필요할 수 있습니다. 이 계산기의 결과는 입력한 세 길이가 같은 종류의 치수라는 전제 안에서 읽어야 합니다.
| 입력·출력 | 뜻 | 설명용 값 |
| 원본 가로 W | 기준 모양의 가로 길이 | 1920 |
| 원본 세로 H | 기준 모양의 세로 길이 | 1080 |
| 새 기준 T | 가로 또는 세로 중 고른 길이 | 새 가로 1280 |
| 배율 k | 새 기준 ÷ 원본의 같은 방향 | 1280÷1920=2/3 |
| 계산된 다른 길이 | 원본의 다른 방향 × k | 1080×2/3=720 |
비율과 배율은 서로 다른 수
원본 비율은 가로÷세로입니다. 예시의 1920:1080을 같은 수로 나누면 16:9가 됩니다. 배율은 얼마나 크기를 바꾸었는지 나타내며 새 가로÷원본 가로 또는 새 세로÷원본 세로로 구합니다. 비율이 16:9인 이미지를 절반 크기로 바꿔도 비율은 16:9이고 배율은 0.5입니다.
계산기는 정수 원본의 최대공약수로 비율을 줄여 표시합니다. 이 표시가 어떤 기기 규격을 인증하는 것은 아닙니다. 1600:900과 1920:1080은 같은 비율이지만 같은 픽셀 수나 같은 파일 크기가 아닙니다. 어느 화면이나 제출 형식에 맞는지를 판단하려면 비율과 실제 치수 조건을 따로 확인해야 합니다.
새 가로를 정할 때의 식
새 가로를 Wnew라고 하면 새 세로는 Hnew=Wnew×H÷W입니다. 1920×1080의 가상 원본을 가로 1280으로 만들면 세로는 1280×1080÷1920=720입니다. 가로와 세로 모두 배율 2/3을 적용했으므로 비율이 유지됩니다. 계산에서 원본 가로와 세로를 반대로 넣으면 다른 답이 나오니 칸의 이름을 확인하세요.
입력에 가로 1280, 원본 세로 1080을 넣고 원본 가로도 1280이라고 잘못 쓰면 결과 세로는 1080이 됩니다. 이것은 도구가 원래 1920을 알아서 추측해 주지 않기 때문입니다. 원본 값은 파일의 실제 속성이나 작업 규격에서 확인한 값을 사용해야 합니다. 계산기에 숫자가 들어 있다는 사실만으로 실제 원본을 읽었다고 생각하지 않습니다.
새 세로를 정할 때의 식
새 세로를 Hnew라고 하면 새 가로는 Wnew=Hnew×W÷H입니다. 원본 1920×1080에서 새 세로 900이면 가로는 900×1920÷1080=1600입니다. 기준 선택을 세로로 바꾼 뒤 새 기준 칸에 900을 넣어 계산하세요. 가로 모드에 같은 900을 넣는 것과 다른 질문이므로 선택 상태가 중요합니다.
설명용 세로형 원본 1080×1920을 가로 540으로 줄이면 세로는 960입니다. 비율은 9:16이며 앞의 16:9와 반대입니다. 사진이 돌아가 있는 경우에는 현재 파일의 가로·세로와 원하는 최종 방향을 확인해야 합니다. 계산 결과만으로 회전이나 자르기를 수행하지 않으며 가로형과 세로형을 자동으로 분류해 기기용 화면으로 바꾸지도 않습니다.
소수 치수는 이상값과 정수 대안을 구분
원본 1920×1080의 새 가로를 1001로 정하면 이상적인 새 세로는 563.0625입니다. 실제 픽셀 치수를 정수로 만들 때 최근접 값은 563입니다. 계산기는 1001×563이라는 정수 대안을 표시하되 이상적인 1001×563.0625와 구분합니다. 두 결과가 완전히 같은 비율이라고 주장하지 않습니다.
정수 대안의 비율 상대 오차는 ((정수 가로÷정수 세로)÷(원본 가로÷원본 세로)−1)×100으로 계산합니다. 양수는 원래보다 더 넓은 비율, 음수는 더 좁은 비율이라는 뜻입니다. 이 값은 모양 비율의 상대 차이이며 이미지 화질 저하율이나 전체 파일 크기 변화율이 아닙니다. 반올림은 정해진 도구 규칙으로 실제 제출 규격의 허용 기준을 대신하지 않습니다.
양쪽 길이를 꼭 고정해야 하면 비율 유지와 다를 수 있다
가상 원본 1920×1080을 꼭 1000×1000에 넣어야 한다면 그대로 늘이는 방식은 비율을 유지하지 않습니다. 가로 1000으로 맞추면 세로는 562.5이며, 세로 1000으로 맞추면 가로는 약 1777.778입니다. 두 방향을 동시에 1000으로 고정하는 것은 다른 모양을 만드는 조건입니다. 이 계산기는 한 방향만 고정하고 다른 길이를 구합니다.
정사각형 영역에 원래 모양을 넣는 방법에는 여백을 남기거나 일부를 자르는 등 별도 선택이 있을 수 있습니다. 이 도구는 원본 내용에서 어디를 잘라야 하는지 판단하지 않습니다. 필요한 얼굴이나 글자가 잘릴 수 있어 실제 내용과 목적을 보아야 합니다. 비율 유지, 영역 채우기와 내용 보존은 서로 다른 질문입니다.
미리보기 상자는 실제 출력 크기가 아니다
계산 뒤 색상 상자가 해당 비율로 나타납니다. 화면 폭에 맞춰 축소된 상자라서 1280×720이라는 실제 픽셀 크기로 페이지에 표시되는 것은 아닙니다. 색상과 모양으로 비율을 비교하는 보조 도해입니다. 출력 결과의 숫자와 상자를 함께 읽되 상자 크기만 보고 실제 파일의 치수를 측정하지 마세요.
MDN과 W3C는 CSS aspect-ratio를 가로·세로의 선호 비율로 설명합니다. 적어도 한쪽 크기가 자동인 조건에서 레이아웃에 사용하며 양쪽 치수를 모두 명시적으로 고정한 상황과 구분합니다. 이 원리는 웹 상자의 표시 설명에 참고한 것으로, 계산기 결과를 입력하면 모든 블로그 스킨이나 문서 앱이 자동으로 파일을 변환한다는 뜻은 아닙니다.
빈칸·잘못된 입력·큰 결과를 처리하는 방식
계산하기를 누르면 이전 결과를 먼저 지우고 새 입력을 확인합니다. 빈칸이면 필요한 칸을 알려 주고, 음수·소수·문자·지수 표기나 0은 허용하지 않습니다. 100001처럼 범위를 벗어난 값도 계산하지 않습니다. 실패했는데 이전 성공 숫자가 그대로 남아 현재 입력의 결과처럼 보이는 상황을 피하려는 구성입니다.
입력은 범위 안이어도 계산된 다른 치수가 1 미만이거나 100,000을 넘으면 결과를 제한합니다. 예를 들어 가상 원본 100000×1을 가로 1로 줄이면 세로는 0.00001이어서 이 도구의 표시 대상이 아닙니다. 범위 제한은 이 계산기의 사용 규칙이며 그 수학 계산 자체가 불가능하다는 뜻은 아닙니다. 다른 길이를 선택하거나 목적에 맞는 도구를 사용하세요.
초기화와 다시 계산하기
예시로 초기화 버튼은 원본 1920×1080, 새 가로 1280으로 돌아가고 결과와 미리보기를 비웁니다. 실제 파일이나 브라우저의 다른 입력을 초기화하는 버튼이 아닙니다. 입력을 고친 뒤 다시 계산하면 이전 결과를 대체합니다. 자동 저장, 방문자 기록이나 외부로 결과를 보내는 기능을 구성요소에 넣지 않았습니다.
키보드로 입력과 기준 선택을 이동하고 계산할 수 있도록 표준 입력·선택·버튼을 사용합니다. 실제 저장된 블로그에서 정상 입력, 빈칸, 잘못된 문자와 초기화가 작동하는지는 발행 단계에서 확인해야 합니다. 로컬 코드 검사는 티스토리의 코드 유지와 실제 페이지 동작의 증거가 아닙니다. 버튼이 작동하지 않으면 완료 상태로 표시해서는 안 됩니다.
가상 연습 결과를 직접 검산하기
설명용 연습은 원본 800×600을 새 가로 400으로 바꾸는 것입니다. 배율은 0.5이고 세로는 300입니다. 원본 1000×1000에서 새 세로 250이면 새 가로도 250으로 1:1을 유지합니다. 원본 1080×1920에서 새 세로 1280이면 가로는 720입니다. 도구 결과와 이 계산을 비교하면 기준 방향을 잘못 고른 경우를 찾기 쉽습니다.
결과를 실제 이미지 편집기에 적용할 때는 그 앱의 크기 변경과 비율 잠금 기능을 확인하고 저장된 파일의 치수도 다시 봅니다. 확대한다고 원본에 없던 세부 정보가 자동으로 생긴다고 보장하지 않습니다. 이 계산기는 두 길이의 비율만 계산하며 인쇄 해상도, 화면 대각선, 픽셀 밀도와 파일 용량을 구하는 도구가 아닙니다. 필요한 질문에 맞게 범위를 구분하세요.
판단 순서 도해
공식 출처와 발행일 점검
발행일에 MDN·W3C의 aspect-ratio 설명을 다시 확인한다. 저장된 블로그에서 정상 계산, 기준 변경, 빈칸·0·잘못된 문자·범위 오류와 초기화를 실제 조작해 확인해야 한다. 로컬 검사를 사이트 검증으로 보고하지 않는다.
작성 범위와 자료 확인일
자료 확인일은 2026년 10월 10일입니다. 공식 문서를 직접 확인하고 AI 작성 보조로 정리했습니다. 가상 파일·업무·수치는 설명용으로 구성했으며 실제 서비스 마이그레이션, Claude 응답 비교 실험, 이용자 설문이나 재료 측정을 수행한 결과가 아닙니다. 로컬 코드 검사와 실제 블로그 저장 후 동작 확인은 구분합니다.
'디지털 지식' 카테고리의 다른 글
| 색상·글자 구분 게임: 안내에 맞는 답을 선택하기 (0) | 2026.10.26 |
|---|---|
| 차트의 보조 축을 읽는 법: 단위가 다른 값 비교 (0) | 2026.10.26 |
| 그래프 읽기 퀴즈: 축·단위·기간부터 확인 (0) | 2026.10.25 |
| 숫자 정렬 게임: 작은 수부터 순서대로 선택하기 (0) | 2026.10.25 |
| 스프레드시트 찾기와 바꾸기 전: 수식·값·범위 확인 (0) | 2026.10.25 |