解像度スケール計算機
画像のスケーリング、縦横比、表示やデジタルコンテンツのピクセル密度を計算します。
縦横比を保ちながら画像解像度を拡大・縮小し、ピクセル密度の変化を計算し、画面サイズや用途に応じた最適な表示設定を求めます。
解像度スケール計算機
画像のスケーリング、縦横比、表示やデジタルコンテンツのピクセル密度を計算します。
解像度スケール計算機について
解像度スケール計算機は、デザイナー、写真家、開発者、デジタルコンテンツ制作者にとって欠かせないツールです。画質と正しい縦横比を保ちながら、画像、動画、表示出力のサイズを変更できます。Web、印刷、映像制作、ゲーム開発のどの用途でも、解像度スケーリングを理解することは、さまざまな表示環境で鮮明かつ適切なサイズのコンテンツを届ける基本です。
解像度スケーリングとは、元の縦横比を維持したまま、一定の係数で画像や表示出力のピクセル寸法を変えることです。縦横比——幅と高さの比率——は変えてはいけません。そうしないと歪みが発生します。たとえば、1920×1080 の画像を 50% に縮小すると 960×540 になり、16:9 の縦横比はそのまま保たれます。この計算機は面倒な計算を自動化するので、手計算ではなく創造的・技術的な判断に集中できます。
拡大率は、両方の寸法に同じように掛ける乗数です。拡大率 0.5 なら元の半分のサイズ、2.0 なら寸法は 2 倍になり、総ピクセル数は 4 倍になります。目標の幅または高さを指定することもでき、その場合は計算機が拡大率を求め、対応するもう一方の寸法を計算します。たとえばメール画像の最大幅が 800px と決まっているときに、比例する高さを求める場合に特に便利です。
総ピクセル数が重要なのは、ファイルサイズ（ラスター画像の場合）、レンダリングの複雑さ（ゲームエンジンや GPU の場合）、そして表示サイズに対する見た目の品質を左右するからです。4K 画像（3840×2160）は 829 万ピクセルで、1080p 画像（207 万ピクセル）の 4 倍です。この関係を理解すると、品質、パフォーマンス、保存容量のバランスをより適切に判断できます。
この計算機の一般的な用途には、レスポンシブデザイン用にサイトのヒーロー画像を複数のブレークポイント向けに調整すること、高解像度の元画像から EC 商品ギャラリー用のサムネイルを作ること、GPU 最適化のためにゲームテクスチャを 2 の累乗サイズにすること、SNS のピクセル要件に合わせて書き出しサイズを計算すること、縦横比を保ったまま画像をダウンサンプリングして Web の読み込みを高速化すること、そして特定の DPI 目標に基づいて印刷用解像度を決めることが含まれます。
例
代表的な解像度スケーリングのシナリオを、用途別に見てみましょう。
| 元の値 → 目標 | スケール後の寸法 | 備考 |
|---|---|---|
| 1920×1080 を 75% に縮小 | 1440×810 px | 1080p を縮小して HD 配信や小さめの表示向けに使用 |
| 3840×2160 → 幅 1920 | 1920×1080 px | 4K を 1080p に縮小しつつ 16:9 を維持 |
| 1200×800 を 50% に縮小 | 600×400 px | プレビュー画像からサムネイルを作る一般的なケース |
| 800×600 を 200% に拡大 | 1600×1200 px | 高 DPI ディスプレイ向けに拡大した 4:3 画像 |
| 1080×1920 → 幅 400 | 400×711 px | 縦長の Instagram 画像をサムネイル用に変更 |
使い方
- 画像またはディスプレイの元の幅と元の高さをピクセルで入力します。
- スケーリング方法を選びます。拡大率（例: 50% なら 0.5）、目標幅、または目標高さを入力します。
- 計算をクリックすると、スケール後の寸法、拡大率、縦横比、総ピクセル数が表示されます。
- 書き出しや画像サイズ変更の際は、スケール後の幅と高さを使用します。
- 異なるプラットフォームや画面サイズのブレークポイント向けに素材を準備するときは、必要に応じて再計算します。
よくある質問
歪みなく画像を拡大・縮小するには？
歪みを避けるには、幅と高さの両方に同じ拡大率を同時に適用します（等比スケーリング）。目標幅しか分からない場合は、目標幅を元の幅で割って拡大率を求め、その同じ係数を元の高さに掛けてスケール後の高さを計算します。この計算機では、目標幅、目標高さ、拡大率のいずれかを入力するだけで、もう一方の寸法を比例計算できます。
解像度と画像サイズの違いは？
解像度は画像のピクセル寸法（例: 1920×1080 ピクセル）を指します。一方、印刷の文脈での画像サイズは、1 インチあたりのピクセル数（PPI または DPI）で決まる物理的な大きさです。1920×1080 の画像を 300 DPI で印刷すると、6.4×3.6 インチの仕上がりになります。同じ画像を 81 PPI の 27 インチモニターに表示すると、画面いっぱいに表示されます。異なる出力媒体向けに画像を正しく準備するには、この両方を理解することが重要です。
Retina/HiDPI ディスプレイでは、どの拡大率を使えばよいですか？
Retina や HiDPI ディスプレイのデバイスピクセル比（DPR）は 2× または 3× であることが多く、CSS ピクセル 1 つに対して物理ピクセルが 2 倍または 3 倍使われます。鮮明な画像を配信するには、想定 CSS 表示サイズの 2 倍または 3 倍の素材を用意します。たとえば Web 画像の表示サイズが 400×300 CSS ピクセルなら、元画像は 800×600（2×）または 1200×900（3×）にします。この計算機で 2.0 または 3.0 の拡大率を使えば、必要な元サイズを求められます。
縦横比とは何で、なぜ重要ですか？
縦横比は幅と高さの比率で、16:9 や 4:3 のように表します。重要なのは、デバイスやプラットフォームごとにネイティブの縦横比が異なるためです。16:9 の画像を 4:3 の枠に無理に入れると、伸びたり切り取られたりします。一般的な縦横比には、16:9（ワイドスクリーン HD 動画）、1:1（Instagram の正方形）、9:16（縦向きモバイル動画）、4:3（従来のテレビやモニター）があります。正しい縦横比を保つことで、ターゲットプラットフォームで自然に見えます。
解像度はファイルサイズにどう影響しますか？
ファイルサイズはおおむね総ピクセル数（幅 × 高さ）に比例して増えます。両方の寸法を 2 倍にするとピクセル数は 4 倍になり、非圧縮データ量もおおむね 4 倍です。ただし、実際のファイルサイズは圧縮方式と内容の複雑さに大きく左右されます。目安として、同じ品質設定で画像サイズを 50%（0.5×）に縮小すると、ファイルサイズは約 75% 減り、Web ページの読み込み速度が大幅に向上します。
1 より大きい拡大率を使えますか（アップスケール）？
はい、1.0 より大きい拡大率で画像を拡大できます。ただし、単純なピクセル拡大では元画像にない細部を追加できません。そのため、拡大すると通常はやや柔らかく、ぼやけた見た目になります。Real-ESRGAN や Adobe Camera Raw の AI 超解像のようなツールなら、もっともらしい細部を生成できます。多くの用途では、必要な最大解像度で素材を用意してから縮小する方が、あとから小さい元画像を拡大するより適しています。