アスペクト比計算ツール（無料・登録不要）
印刷サイズ換算（DPI指定）
- 幅・高さ → 比率: 解像度（例: 1920×1080）からアスペクト比を求める。動画や画像のサイズ確認に
- 比率・幅 → 高さ: 幅が決まっていてアスペクト比から高さを出す。Webデザイン・バナー制作に
- 比率・高さ → 幅: 高さが決まっていてアスペクト比から幅を出す
- 比率・短辺 → 長辺: 短辺を基準に長辺を求める。印刷サイズ計算に
aspect-ratio プロパティのコードをワンクリックでコピーできます。CSSのpadding-topハックも生成します。
アスペクト比とは
アスペクト比（縦横比）とは、画像・動画・ディスプレイの幅と高さの比率を表した数値です。「16:9」は幅16に対して高さ9という意味で、現在のHD動画やスマートフォン横向き表示の標準比率です。アスペクト比を保ったままサイズを変更することで、画像の歪みを防ぎます。
GCD（最大公約数）による最簡形式
1920×1080 のアスペクト比は、GCD（最大公約数）= 120 で割ると 16:9 になります。本ツールはGCDを自動計算し、最もシンプルな形式で比率を表示します。例: 1280×1024 → GCD = 256 → 5:4。
主要なアスペクト比の用途
| 比率 | 主な用途 | 代表的なサイズ |
|---|---|---|
| 16:9 | HD動画・YouTube・ゲーム・PC | 1920×1080 / 1280×720 |
| 4:3 | 旧テレビ・プレゼン・デジカメ | 1024×768 / 800×600 |
| 1:1 | Instagram正方形・プロフィール | 1080×1080 |
| 9:16 | スマホ縦動画・ストーリーズ | 1080×1920 |
| 21:9 | シネスコープ・ウルトラワイド | 2560×1080 |
| 3:2 | 一眼レフ・35mmフィルム | 6000×4000 |
| 5:4 | モニター（旧SXGA） | 1280×1024 |
| 16:10 | MacBook・WUXGAモニター | 1920×1200 |
各SNSの推奨サイズとアスペクト比の一覧です。本ツールのSNSプリセットからワンクリックで計算できます。
| SNS | 用途 | 推奨サイズ | アスペクト比 |
|---|---|---|---|
| フィード（正方形） | 1080×1080px | 1:1 | |
| フィード（縦型・推奨） | 1080×1350px | 4:5 | |
| ストーリーズ・リール | 1080×1920px | 9:16 | |
| X（旧Twitter） | プロフィール画像 | 400×400px | 1:1 |
| ヘッダー画像 | 1500×500px | 3:1 | |
| 投稿画像（1枚） | 1200×675px | 16:9 | |
| YouTube | サムネイル | 1280×720px | 16:9 |
| チャンネルアート | 2560×1440px | 16:9 | |
| 投稿・シェア画像 | 1200×630px | ≈ 1.91:1 | |
| 投稿画像 | 1200×627px | ≈ 1.91:1 | |
| TikTok | 動画・プロフィール | 1080×1920px | 9:16 |
※ 2026年5月現在の情報。各SNSの仕様変更により推奨サイズが変わる場合があります。
印刷解像度とアスペクト比の関係
印刷では解像度（DPI: Dots Per Inch）が重要です。一般的な印刷品質は 300 DPI。A4（210×297mm）を 300DPI で印刷する場合、必要なピクセル数は幅 2480px × 高さ 3508px。アスペクト比は約 5:7（正確には √2 ≈ 1:1.414）です。
主要印刷サイズ一覧
| サイズ | mm（W×H） | 300DPIピクセル | アスペクト比 |
|---|---|---|---|
| A4 | 210×297 | 2480×3508 | ≈ 1:1.41（√2） |
| A5 | 148×210 | 1748×2480 | ≈ 1:1.41（√2） |
| B5 | 182×257 | 2149×3035 | ≈ 1:1.41 |
| L判（写真） | 89×127 | 1051×1500 | ≈ 1:1.43 |
| 2L判（写真） | 127×178 | 1500×2102 | ≈ 1:1.40 |
| 名刺 | 91×55 | 1075×650 | ≈ 5:3 |
DPIを考慮したサイズ計算方法
mm → ピクセル の変換: ピクセル = mm × DPI ÷ 25.4。例: A4の幅210mm × 300DPI ÷ 25.4 = 2480px。本ツールの「比率・幅→高さ」モードで1:1.414を入力すれば、A判の縦横を計算できます。
CSS aspect-ratio プロパティ（現代的な方法）
CSS の aspect-ratio プロパティで要素のアスペクト比を維持できます。本ツールで生成したコードをそのまま使用できます。
/* 16:9の場合 */
.element {
width: 100%;
aspect-ratio: 16 / 9;
}
/* 対応ブラウザ: Chrome 88+ / Firefox 89+ / Safari 15+ */padding-topハック（旧来の方法・IE対応）
古いブラウザへの対応が必要な場合は padding-top ハックを使います。本ツールのコードコピーから生成できます。
/* 16:9の場合: 9/16 = 56.25% */
.wrapper {
position: relative;
padding-top: 56.25%;
height: 0;
}
.wrapper > .content {
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
}レスポンシブ画像のアスペクト比指定
HTMLの img タグに width と height 属性を明示することで、ブラウザがCLS（レイアウトシフト）を防ぎます。本ツールで比率を確認してから記述することを推奨します。
<img src="photo.jpg" width="1920" height="1080"
style="width:100%;height:auto;" alt="説明文">- Q アスペクト比とは何ですか？
- A アスペクト比（縦横比）とは、画像・動画・画面の幅と高さの比率を「16:9」のように表したものです。同じアスペクト比なら、解像度が異なっても形の比率は同じです。例えば 1920×1080 も 1280×720 も、どちらも 16:9 のアスペクト比です。
- Q 「最簡形式」とはどういう意味ですか？
- A 幅と高さの最大公約数（GCD）で割った、これ以上シンプルにできない形の比率です。例えば 1920:1080 の GCD は 120 なので、1920÷120 = 16、1080÷120 = 9 となり「16:9」が最簡形式です。
- Q 16:9と1920×1080の違いは何ですか？
- A 16:9 はアスペクト比（形の比率）で、1920×1080 は解像度（実際のピクセル数）です。1920×1080・1280×720・960×540 はすべて 16:9 のアスペクト比を持ちますが、解像度（画質・ファイルサイズ）が異なります。
- Q YouTube動画に最適なアスペクト比は？
- A YouTubeは 16:9（横長）が標準です。推奨解像度は 1920×1080（Full HD）または 1280×720（HD）。スマホ縦動画（ショート）は 9:16 を使用します。アスペクト比が合わない場合、YouTubeが自動的に黒帯（レターボックス）を追加します。
- Q Instagramに投稿する画像の最適なアスペクト比は？
- A Instagramフィードは 4:5（縦型・1080×1350px）が最も表示面積が大きく推奨されます。正方形は 1:1（1080×1080px）。ストーリーズ・リールは 9:16（1080×1920px）が標準です。
- Q CSSのaspect-ratioプロパティはどのブラウザで使えますか？
- A CSS aspect-ratio プロパティは Chrome 88以降・Firefox 89以降・Safari 15以降・Edge 88以降で対応しています（2026年現在、主要ブラウザすべてで利用可能）。IE11は未対応のため、IE対応が必要な場合は padding-top ハックを使用してください。本ツールでどちらのコードも生成できます。
- Q 印刷に使う場合の解像度はどう計算しますか？
- A 印刷解像度の計算式は「ピクセル数 = mm × DPI ÷ 25.4」です。A4（210×297mm）を300DPIで印刷する場合、幅は 210 × 300 ÷ 25.4 ≈ 2480px になります。本ツールの「幅・高さ→比率」モードで 2480×3508 を入力すると、A判のアスペクト比を確認できます。