2026.08.17デザインにおける比率とは?黄金比・白銀比・三分割法を理解するTECH BLOG

  • HOME
  • TECH BLOG
  • デザインにおける比率とは?黄金比・白銀比・三分割法を理解する

デザインにおける比率とは?黄金比・白銀比・三分割法を理解する

Webサイトやバナー、チラシなどのデザインでは、「どこに要素を配置するか」だけでなく、「要素同士の大きさのバランス」も重要です。

そのバランスを考えるときに役立つのが「比率」です。

今回は、デザインでよく使われる「黄金比」「白銀比」「三分割法」について紹介します。

デザインにおける「比率」とは?

比率とは、2つ以上のものの大きさを比較したときの割合のことです。

デザインでは、画像と余白、文字と画像、レイアウトの幅と高さなど、さまざまな要素のバランスを決めるために使われます。

適切な比率を意識することで、感覚だけに頼らず、全体のバランスが整ったデザインを作りやすくなります。

黄金比

黄金比は、約1:1.618の比率です。

古くから美しいバランスとして知られており、デザインや建築などさまざまな分野で利用されています。

例えば、長方形をデザインに使用するときに黄金比を取り入れることで、縦と横のバランスを整えることができます。

Webデザインでは、メインビジュアルのレイアウトや画像とテキストの配置などに応用できます。

黄金比は「必ずこの比率にすれば美しい」というものではありませんが、デザインのバランスを考えるときの目安として利用できます。

白銀比

白銀比は、約1:1.414の比率です。

日本では、A4などの用紙に使われる「1:√2」の比率が身近な例です。

A4用紙を半分に折っても、縦横の比率がほぼ同じになるため、印刷物では扱いやすい比率といえます。

Webサイトのデザインでは、印刷物ほど直接的に使われるわけではありませんが、画像やレイアウトの比率を考える際の参考になります。

三分割法

三分割法は、画面や写真などを縦・横それぞれ3等分し、その線や交点を基準に要素を配置する方法です。

例えば、写真を3×3の9つのエリアに分け、重要な被写体や文字を線上や交点付近に配置します。

中央にすべての要素を配置するよりも、視線の流れが生まれやすく、バランスのよい構図を作ることができます。

Webサイトのメインビジュアルやバナーなどでも活用できます。

3つの比率・構図の違い

方法 特徴 主な使い方
黄金比 1:1.618の比率 要素同士のバランスを整える
白銀比 1:1.414の比率 用紙や画像などのサイズ設計
三分割法 縦横を3等分して配置 写真やレイアウトの構図を整える

比率は「ルール」ではなく「目安」

黄金比や白銀比などは、デザインを整えるための便利な考え方ですが、必ずその比率に合わせなければいけないわけではありません。

デザインでは、情報量や目的、見る人、使用する媒体などによって適切なバランスが変わります。

そのため、比率をそのまま当てはめるのではなく、デザインのバランスを考えるための目安として使うことが大切です。

まとめ

デザインにおける比率は、要素同士のバランスを考えるための重要な考え方です。

  • 黄金比:1:1.618の比率
  • 白銀比:1:1.414の比率
  • 三分割法:画面を3×3に分けて要素を配置する方法

これらを知っておくと、デザインに迷ったときに「なんとなく」ではなく、一定の基準をもってレイアウトを考えられるようになります。

まずはバナーやWebサイトのメインビジュアルなど、身近なデザインに当てはめて試してみるとよいでしょう。