📏 CSS単位変換

px, rem, em, vw, vh, %, pt などのCSS単位をリアルタイムで相互変換します。

基準設定

ベースフォントサイズ (px)

ビューポート幅 (px)

ビューポート高さ (px)

値

単位

CSS単位変換の使い方は？

数値を入力し、変換元と変換先の単位を選択すると、自動的に変換結果が表示されます。ルートフォントサイズの設定も可能です。

対応している単位は？

px、rem、em、vw、vhなど、よく使われるCSS単位間の変換に対応しています。

pxとremの違いは何ですか？

pxは固定サイズ、remはルート要素のフォントサイズ基準の相対サイズです。レスポンシブデザインではremの使用が推奨されます。

1remは何pxですか？

ブラウザのデフォルト設定では1rem = 16pxです。ルート要素のfont-sizeを変更すると、rem値に対応するpx値も変わります。

vwとvhの違いは何ですか？

vwはビューポート（表示領域）の幅の1%、vhはビューポートの高さの1%を表す相対単位です。例えば、1920px幅の画面では1vw = 19.2px、1080px高さの画面では1vh = 10.8pxになります。フルスクリーンのレイアウトやレスポンシブデザインに便利です。

ビューポート単位の基準サイズは変更できますか？

はい、基準設定欄の「ビューポート幅」と「ビューポート高さ」の値を変更することで、任意の画面サイズでのvw/vh変換結果を確認できます。デフォルトは1920x1080（フルHD）に設定されています。

変換計算式は確認できますか？

はい、変換結果の下に各単位への変換に使用された計算式が自動的に表示されます。px経由での二段階変換の過程も確認できるので、学習や検証に活用できます。