このツールについて
ピクセル値を入力すると対応する rem が即座に表示され、2 つの欄は連動しているのでどちらを編集しても他方が更新されます。ルート文字サイズの初期値はブラウザ既定の 16px ですが、プロジェクトで html の font-size を変更している場合はその値を入力すれば正しい換算が得られます。下の対照表は 1px から 128px までを網羅しています。
CSS / FRONTEND · ブラウザ内で処理
PX から REM 変換
ピクセルを rem に変換。ルート文字サイズを指定でき、対照表も付属。
ルート文字サイズの初期値は 16px で、1〜200px を指定できます。対照表は 1px から 128px までを網羅します。結果は小数第 4 位で四捨五入します。
入力
ブラウザの既定は 16px です。プロジェクトで html の font-size を変更している場合は実際の値を入力してください。
結果
REM1.5rem
常用サイズ対照表
| ピクセル | REM |
|---|---|
1px | 0.0625rem |
2px | 0.125rem |
4px | 0.25rem |
6px | 0.375rem |
8px | 0.5rem |
10px | 0.625rem |
12px | 0.75rem |
14px | 0.875rem |
16px | 1rem |
18px | 1.125rem |
20px | 1.25rem |
24px | 1.5rem |
28px | 1.75rem |
32px | 2rem |
36px | 2.25rem |
40px | 2.5rem |
48px | 3rem |
56px | 3.5rem |
64px | 4rem |
72px | 4.5rem |
80px | 5rem |
96px | 6rem |
128px | 8rem |
操作手順
- ルート文字サイズを確認または変更します（初期値 16px）。
- ピクセル値を入力して rem の結果を得ます。
- 個別の結果をコピーするか、対照表から常用サイズを読み取ります。
プライバシー
計算もプレビューもすべてこのブラウザ内で行われます。入力が送信・保存されることも、URL やログに記録されることもありません。
よくある質問
- なぜ px ではなく rem を使うのですか。
- rem はルート文字サイズに対する相対値のため、利用者がブラウザの既定文字サイズを大きくするとレイアウト全体がそれに追随します。px を直接指定するとその設定は完全に無視されます。文字サイズや余白を rem で定義するのは、アクセシブルなサイトの標準的な手法です。
- 16px は何 rem ですか。
- 既定のルート文字サイズ 16px では、16px がちょうど 1rem、24px が 1.5rem、12px が 0.75rem です。つまり rem 値はピクセル値を 16 で割った値になります。