화면 비율 완벽 정리: 16:9, 4:3, 21:9 차이와 활용

유튜브 썸네일은 16:9로 만들어야 하고, 인스타그램 피드는 1:1이 기본이고, 영화는 21:9로 촬영되고... 콘텐츠를 만들다 보면 화면 비율 때문에 머리가 아플 때가 많습니다. 각 비율이 왜 존재하고, 어디에 쓰이는지 정리해봤습니다.

화면 비율이란

화면 비율(aspect ratio)은 화면의 가로와 세로 길이의 비율입니다. 16:9라고 하면 가로가 16, 세로가 9인 직사각형을 뜻해요. 실제 크기(픽셀)와는 별개입니다. 1920x1080도 16:9이고, 3840x2160(4K)도 16:9예요. 비율이 같으니 영상이 늘어나거나 찌그러지지 않고 그대로 확대됩니다.

주요 비율별 특징

4:3 — 클래식

옛날 TV와 초기 컴퓨터 모니터의 표준이었습니다. 지금은 거의 안 쓰지만, 아이패드 화면이 아직 4:3에 가깝습니다. 문서 작업이나 웹 브라우징에는 오히려 세로 공간이 넓어서 편하다는 사람도 있어요. 프레젠테이션 슬라이드도 과거에는 4:3이 기본이었는데, 요즘은 16:9로 바뀌었습니다.

16:9 — 현재 표준

2026년 현재 가장 많이 쓰이는 비율입니다. 유튜브, 넷플릭스, TV 방송, 대부분의 모니터와 노트북이 이 비율이에요. 1920x1080(Full HD), 2560x1440(QHD), 3840x2160(4K) 모두 16:9입니다. 콘텐츠를 만들 때 어떤 비율로 할지 고민된다면 일단 16:9로 가면 거의 맞습니다.

21:9 — 울트라와이드

영화관 스크린에 가까운 비율입니다. 정확히는 2.39:1에 가까운데, 편의상 21:9로 부릅니다. 울트라와이드 모니터(3440x1440 등)가 이 비율이에요. 영상 편집이나 코딩할 때 양쪽에 패널을 두고 작업하기 좋습니다. 다만 일반 유튜브 영상을 재생하면 양 옆에 검은 띠가 생깁니다.

1:1 — 정사각형

인스타그램 피드의 기본 비율입니다. 모바일에서 보기 좋고, 피드에서 균일한 느낌을 줍니다. 프로필 사진, 앨범 커버, 앱 아이콘도 보통 1:1이에요.

9:16 — 세로형

스마트폰을 세로로 들고 보는 비율입니다. 틱톡, 유튜브 쇼츠, 인스타 릴스, 인스타 스토리 모두 이 비율이에요. 모바일 우선 시대에 가장 빠르게 성장하고 있는 비율이기도 합니다.

플랫폼별 권장 비율

비율 계산하는 법

가로와 세로의 최대공약수(GCD)로 나누면 됩니다. 예를 들어 1920x1080의 최대공약수는 120이니까, 1920/120 : 1080/120 = 16:9가 됩니다.

근데 실무에서는 이런 수학을 매번 하기 귀찮죠. 특히 비표준 해상도(예: 1366x768)는 최대공약수로 나눠도 깔끔한 비율이 안 나오기도 합니다. 그래서 계산기를 쓰는 게 빠릅니다.

CSS에서 비율 고정하기

반응형 웹에서 이미지나 비디오의 비율을 유지하려면 aspect-ratio 속성을 쓰면 됩니다.

.video-container {
  width: 100%;
  aspect-ratio: 16 / 9;
}

.square-card {
  aspect-ratio: 1;
}

예전에는 padding-bottom: 56.25% 같은 꼼수를 써야 했는데, 이제는 aspect-ratio 한 줄이면 끝입니다. 모든 모던 브라우저에서 지원합니다.