px→vw 換算：計算式と換算表

ピクセル px ビューポート幅単位 vw

ビューポート幅（px）

1 px = 0.05208333333 vw

PX → REM 変換で開く

計算式

vw = px × 100 ÷ 1920

換算方法

ピクセルをビューポート幅単位に換算するには、計算式 vw = px × 100 ÷ 1920 を使います。例：32 px = 1.666666667 vw。

換算表

px	vw
1 px	0.05208333333 vw
2 px	0.1041666667 vw
4 px	0.2083333333 vw
8 px	0.4166666667 vw
10 px	0.5208333333 vw
12 px	0.625 vw
14 px	0.7291666667 vw
16 px	0.8333333333 vw
18 px	0.9375 vw
20 px	1.041666667 vw
24 px	1.25 vw
32 px	1.666666667 vw
48 px	2.5 vw
64 px	3.333333333 vw

換算表はビューポート幅 1920pxを前提にしています。上の換算ツールで設定をプロジェクトに合わせて変更できます。

これらの単位について

ブラウザーはすべての CSS の長さを最終的にピクセルに変換します。rem はルートのフォントサイズ、em は親要素のフォントサイズが基準で、ページやユーザーが変更しない限り主要ブラウザーではどちらも 16px です。1pt は 1/72 インチ、1px は 1/96 インチなので 1pt = 1.333px です。vw はビューポート幅の 1% で、ピクセル数は画面幅によって変わります。

よくある質問

› px を vw に換算するには？

1 px = 0.05208333333 vw です。換算するには計算式 vw = px × 100 ÷ 1920 を使います：32 px = 1.666666667 vw。

› 1 vw は何 px ですか？

1 vw = 19.2 px です。逆方向の計算式は px = vw × 1920 ÷ 100 です。

› px ではなく rem を使う理由は？

rem はユーザーがブラウザーで設定した文字サイズに追従するのでアクセシビリティに優れ、ルートの値を 1 つ変えるだけでレイアウト全体を一貫して拡大縮小できます。

› rem と em の違いは？

rem は常にルート（html）のフォントサイズを使います。em は親要素のフォントサイズを使うため、入れ子にすると値が掛け合わされます。