白銀比（1:√2）の計算

短い辺か長い辺を1つ入れると、白銀比（1:1.414）のもう一方の長さを計算します。A判・B判の用紙と同じ比率で、黄金比など他の比率とも見比べられます。

黄金比・第2白銀比などもまとめて計算する

4つの計算モード
  • 横長 / 縦長モード
    作りたい図形の向きを選択します。入力した数値を「幅」にするか「高さ」にするかを指定して、理想のサイズを算出します。
  • 分割 (Split Mode)
    入力値を「全体幅」とし、黄金比などで2分割（A:B）します。Webレイアウトのメイン:サイドバー比率などに。
  • 文字 (Typography Mode)
    基準サイズ（16pxなど）から、モジュラースケールに基づいた文字サイズ（h1・h2・h3・本文・小さい文字の5段）を一括生成します。
Web制作・DTPへの活用

計算結果は単なる数値だけでなく、以下の形式でコピー可能です。

  • CSS Variables: :root { --h1: 2.4rem; ... } 形式でコピー。
  • aspect-ratio: モダンなCSSアスペクト比プロパティを生成。
  • Flexbox: 分割モード時、flex-basis の値を生成。
  • 単位変換: 入力した値を px・rem・mm・inch・pt に換算して表示（rem は 1rem＝16px で計算）。
Tips: 黄金比カードの右上にある ボタンを押すと、正確な黄金螺旋ガイドが表示されます。

デザインに使用される代表的な比率（貴金属比）の一覧と、それぞれの特徴・用途です。

名称 比率 (近似値) 特徴と主な用途
黄金比
Golden Ratio		 1 : 1.618 (1 + √5) ÷ 2 の比率。ロゴや見出しなど、印象をつくる要素の設計によく使われます。巻貝やパルテノン神殿、有名な企業ロゴに使われているという説明もよく見かけますが、後から測って当てはめたものとする指摘が多く、作り手が意図した確かな根拠はありません。
白銀比 (大和比)
Silver Ratio		 1 : 1.414 「ルート2」の比率。A4・B5などの用紙サイズ規格（JIS P 0138）に使われていて、日本では大和比とも呼ばれます。法隆寺などの伝統建築に使われているという説明もありますが、諸説あり確かではありません。
第2白銀比
Silver Ratio 2		 1 : 2.414 白銀比の派生形。正八角形の構成要素としても知られ、独特な鋭さと安定感を持ちます。
青銅比
Bronze Ratio		 1 : 3.303 非常に横長（または縦長）な比率。強いコントラストや、洗練されたモダンなレイアウトを作る際に用いられます。
16:9
Wide		 1 : 1.778 現代の標準的なモニター、YouTubeサムネイル、ハイビジョン放送の比率。Webデザインのヒーローエリアによく使われます。
OGP画像
SNS Card		 1.91 : 1 FacebookやX(Twitter)のシェア画像（OGP）で広く使われている比率（1200×630px）。正方形に切り取って表示するサービスもあります。

黄金比 (1:1.618) は、自然で有機的な美しさや、豪華さ・ゆとりを表現したいデザイン（アート、ロゴ、余白の多いLP）に向いています。
白銀比 (1:1.414) は、規則正しく整った印象や、情報の整理整頓が求められるデザイン（A4書類、管理画面、日本の伝統的な和風デザイン）に向いています。

「文字 (Typo)」モードを使い、基準となる本文サイズ（例: 16px）を入力してください。比率を選ぶことで、調和の取れた見出しサイズ（h1, h2...）を自動計算できます。 一般的に、ブログ等はMajor Third (1.250)、インパクト重視のLPはGolden Ratio (1.618)などが推奨されます。

rem はルート要素（通常はhtmlタグ）のフォントサイズを基準とした相対単位です。 Webアクセシビリティの観点から、ユーザーがブラウザ設定で文字サイズを変更した場合に正しく追従するため、現代のWeb制作では px よりも rem の使用が推奨されています。このツールでは自動的にpxをremに変換して出力します。
入力値の適用先:
白銀比 (1 : 1.414...)
黄金比 (1 : 1.618...)
カスタム比率
:
単位換算 (DPI基準)
白銀比 第2 (1 : 2.414...)
青銅比 (1 : 3.303...)
白金比 (1 : 1.732...)
1:2 (ダブルスクエア)
16:9 (ワイド)
16:10 (PC / Mac)
1.91:1 (OGP / SNS)
4:3 (クラシック)
3:2 (写真)
4:5 / 5:4 (Instagram)
21:9 (ウルトラワイド)
2.35:1 (シネマ)
1:1 (スクエア)

比率の逆引き

白銀比（1:√2）とは？長さの求め方と使いどころ

白銀比は、短い辺と長い辺の比が 1 : √2（約 1 : 1.4142）になる比率です。日本では大和比（やまとひ）とも呼ばれ、A4 や B5 などのコピー用紙がこの形をしています。 長い辺は「短い辺 × 1.4142」、短い辺は「長い辺 ÷ 1.4142（＝長い辺 × 0.7071）」で求められます。たとえば幅 1000px の横長の枠なら高さは約 707px、短い辺が 1000px なら長い辺は約 1414px です。 このページの計算ツールは、数値を1つ入れるだけで白銀比のもう一方の長さと CSS の aspect-ratio を出力します。計算はブラウザの中で完結し、入力した数値はサーバーに送られません。

半分に折っても同じ形になる理由

短い辺が 1、長い辺が √2 の長方形を、長い辺の真ん中で半分に切ると、できる長方形は短い辺が √2 ÷ 2（約 0.707）、長い辺が 1 になります。この比を計算すると 0.707 : 1 ＝ 1 : 1.414 で、元と同じ白銀比です。 半分にしても形が変わらない長方形は、この 1:√2 だけです。A3 を半分にすると A4、A4 を半分にすると A5 になり、拡大・縮小コピーをしても余白が出ないのはこの性質のおかげです。

A4を半分に切ると、同じ形のA5が2枚になる図 A5 1 : 1.414 A5 1 : 1.414 A4（1 : 1.414）をここで半分に
横に置いた A4 を真ん中で切ると、縦長の A5 が2枚できます。どちらも縦横比は 1:1.414 のままです。

A判・B判の寸法と縦横比

サイズ 寸法（mm） 長い辺 ÷ 短い辺
A0841 × 11891.4138
A3297 × 4201.4141
A4210 × 2971.4143
A5148 × 2101.4189
A6105 × 1481.4095
B4257 × 3641.4163
B5182 × 2571.4121

寸法は JIS P 0138（紙加工仕上寸法）によります。B判は日本独自の JIS B 列です。A0 は面積がほぼ 1㎡、B0（1030 × 1456mm）はほぼ 1.5㎡ になるよう決められ、そこから半分ずつにして各サイズが作られています。寸法をミリ単位に丸めているため、縦横比は √2（1.41421…）からわずかにずれます。

Webデザインで白銀比を使うには

画像やカードの枠を白銀比にするなら、CSS の aspect-ratio: 1.4142 / 1;（横長）または aspect-ratio: 1 / 1.4142;（縦長）が手軽です。上の計算ツールで「横長」「縦長」を選ぶと、このコードがそのまま出力されます。 文字サイズを比率で決める場合は、「文字」モードの「Augmented 4th (1.414)」のカードが白銀比にあたります。黄金比（1.618）より段差がおだやかで、見出しが大きくなりすぎません。 A4 の書類をそのまま画面に載せる、印刷物と Web で同じ比率の図版を使う、といった場面でも、白銀比でそろえておくと切り抜きや余白の調整が要りません。

よくある質問 (FAQ)

1 : √2 ＝ 1 : 1.41421356… です。√2 は小数がどこまでも続く無理数なので、実務では 1.414 か 1.4142 に丸めて使います。画面のピクセル計算なら 1.414 で十分です。

長い辺 ＝ 短い辺 × 1.4142、短い辺 ＝ 長い辺 ÷ 1.4142（＝ 長い辺 × 0.7071） です。 幅 1000px の横長の枠なら高さは約 707px、短い辺が 1000px なら長い辺は約 1414px になります。

ほぼ白銀比ですが、完全には一致しません。A4 は 210 × 297mm で、297 ÷ 210 ＝ 1.4143 です。 規格では寸法をミリ単位に丸めているため、√2（1.41421…）とはわずかにずれます。目で見て分かる差ではありません。

同じ 1:√2 を指す呼び名です。大和比は日本での呼び名として使われています。 なお数学の「貴金属比」でいう白銀比は 1 + √2（約 2.414）で、別の数です。このツールではそちらを「第2白銀比」と表記しています。

aspect-ratio プロパティを使います。横長なら aspect-ratio: 1.4142 / 1;、縦長なら aspect-ratio: 1 / 1.4142; と書き、幅を決めれば高さが自動で決まります。 このツールで「横長」「縦長」を選ぶと、白銀比のカードにこのコードが表示され、そのままコピーできます。

他の CSS ジェネレーター