アスペクト比の概要・基礎知識
アスペクト比(縦横比)は、画像・動画・画面の「幅 : 高さ」の比率を整数比で表したものです。同じアスペクト比であればサイズが変わっても見た目の印象は同じなため、SNS投稿用画像のリサイズ、モニター選び、CSSのaspect-ratioプロパティ指定など幅広く使われます。本ツールは「幅と高さからアスペクト比を求める」「指定アスペクト比から幅または高さを逆算する」の2モードを切り替えられ、計算結果には整数比・小数比・比率プレビューを同時表示します。動画編集・Web制作・印刷デザインの現場で、寸法決定の意思決定を素早く支援する用途に最適です。
計算式と代表的な比率
| 計算 | 式 |
|---|---|
| アスペクト比 | 幅 ÷ GCD(幅, 高さ) : 高さ ÷ GCD(幅, 高さ) |
| 幅から高さ | 高さ = 幅 × (比率高 ÷ 比率幅) |
| 高さから幅 | 幅 = 高さ × (比率幅 ÷ 比率高) |
| 小数比 | 幅 ÷ 高さ(例: 16:9 ≒ 1.778) |
例として1920×1080はGCD=120で割って16:9、1024×768はGCD=256で4:3となります。1366×768のようにきれいな整数比にならないサイズもあり、その場合は最も近い標準比(16:9)として扱われるのが一般的です。
使い方の流れ
- 「比率を計算」モードで現在の幅と高さを入力すると、アスペクト比(整数比)と小数比が表示されます。手元の素材が標準比に該当するかをまず確認できます。
- 「サイズを計算」モードに切り替え、目標のアスペクト比をプリセット(16:9 / 4:3 / 1:1 / 21:9 / 9:16 / 3:2)から選びます。
- 幅と高さのどちらを基準にするかを選択し、基準値(px)を入力します。残り1辺が自動計算されます。
- 結果カード下部の「比率プレビュー」で実際の縦横バランスを視覚的に確認します。デザインのトリミング前のシミュレーションに便利です。
- 必要に応じて「結果をコピー」で値をクリップボードに転送し、Photoshop / Figma / 動画編集ソフトの書き出しサイズ欄へ貼り付けます。
こんな場面で使う
- YouTube動画制作:16:9の標準比で1080pや4Kの解像度を素早く確認できます。Shortsを作るときは9:16へ切替が便利です。
- SNSバナー設計:Instagram投稿(1:1)、Stories(9:16)、X(16:9)など、プラットフォームごとに必要な解像度を自動計算できます。
- Web制作のCSS設定:
aspect-ratio: 16/9;のように指定したコンテナのサイズ感を、実数値で確認しながら設計できます。 - プレゼン資料作成:4:3の旧型スクリーンと16:9のワイドモニター両対応の資料サイズを準備する際の指標になります。
- モニター・テレビ購入:21:9のウルトラワイドが机にどれだけ占有するか、3:2 Surface系がどんな見え方かを事前にイメージできます。
使う前に知っておきたい注意点
- 計算結果は整数比として簡約されますが、入力値によってはきれいな数字にならず
683:384のような中途半端な比率になることがあります。標準比に丸める場合は近い値(16:9等)を採用してください。 - 動画やWebでは、表示時にレターボックス(黒帯)やトリミングが入る場合があります。本ツールの出力サイズはあくまで「コンテンツの理論値」です。
- 16:9と16:10は見た目が似ていますが別比率です。モニター仕様を確認するときは細かな数値まで照らし合わせましょう。
- SNSプラットフォームは予告なく推奨アスペクト比を変更することがあります。本番投稿前に各サービスの最新ガイドラインを必ず確認してください。
- 1pxの誤差で意図と違うトリミングが入る場合があります。フォントや余白を含めたデザインは、最終比率より少し余裕を持たせて作成するのが安全です。
よく使われるアスペクト比一覧
- 16:9:YouTube、テレビ、PCモニター。1920×1080 / 3840×2160(4K)が代表。
- 9:16:TikTok、Instagram Stories、YouTube Shorts。1080×1920が標準。
- 1:1:Instagram投稿、プロフィール画像。1080×1080が定番。
- 4:3:iPad、旧型テレビ、プロジェクター。1024×768 / 2048×1536。
- 21:9:ウルトラワイドモニター、シネマスコープ。2560×1080 / 3440×1440。