CSS単位変換でできること
px、rem、em、%、vw、vh、vmin、vmaxを、指定した文字サイズや表示領域に沿って相互変換します。文脈依存の値を入力せずに固定値として断定しないため、実際のCSSに合わせた換算結果を確認できます。
使い方
- 値、変換元、変換先を選びます。
- 利用中のルート文字サイズ、親文字サイズ、100%の基準長、ビューポート寸法を入力します。
- 換算結果と途中のCSS px値を確認し、必要ならコピーします。
remとemの基準
remはルート要素の文字サイズ、emは換算対象で1emになる文字サイズを基準にします。CSSではプロパティや継承位置によって参照先が変わる場合があるため、ブラウザから自動推測せずpx値を入力します。
%の基準長
CSSの割合は、常に親要素の幅を指すわけではありません。幅、高さ、余白、transformなど、対象プロパティの仕様とレイアウトから100%に相当する長さを確認し、そのpx値を「100%の基準長」へ入力します。
viewport相対単位
1vwは入力した幅の1%、1vhは高さの1%です。vminは幅と高さの短い方、vmaxは長い方の1%として計算します。標準viewport単位だけを扱い、small・large・dynamic viewport単位は対象外です。
精度と入力データ
通常の10進数をBigIntの整数比として扱い、CSS pxを経由して計算します。CSS pxは画面の物理ピクセル数や実寸ではありません。結果は有効数字15桁で四捨五入し、丸めが生じた場合は「近似表示」と示します。計算、コピーはブラウザ内で完結し、値を外部へ送信・保存しません。