CSS 単位変換器
CSS単位 px・rem・em・vw を即座に相互変換。ルートフォントサイズ・ビューポート幅を設定可能。ブラウザ完結、無料。
使い方
- Value フィールドに数値を入力します。
- 元の単位（px・rem・em・vw）を選択します。
- 4種類の単位の変換結果が即座に更新されます。
- 必要に応じてルートフォントサイズやビューポート幅をプロジェクトの設定に合わせて調整します。
- 各結果の横にある Copy ボタンでクリップボードにコピーします。
よく使う変換の例
デフォルト設定（ルートフォントサイズ16px、ビューポート1920px）の場合：
16px=1rem=1em=0.833vw1rem=16px100vw=1920px=120rem
各単位の使いどころ
- px — 絶対サイズ。ボーダーや細部のデザインに適します。
- rem — ブラウザのフォントサイズ設定に連動。アクセシブルなデザインでフォントサイズや余白に推奨。
- em — 親要素のフォントサイズを基準にします。コンポーネント内の相対サイジングに便利。
- vw — ビューポート幅を基準にします。流動的なタイポグラフィや全幅レイアウトに適します。
FAQ
対応しているCSS単位は何ですか？
px・rem・em・vwに対応しています。任意の単位で値を入力すると、4種類すべての変換結果が即座に表示されます。
remはどのように計算されますか？
rem（ルートem）はルート要素のフォントサイズを基準にします。デフォルトは16pxなので、1rem = 16pxです。設定からルートフォントサイズを変更できます。
vwはどのように計算されますか？
vwはビューポート幅の1%です。ビューポート幅1920pxの場合、1vw = 19.2pxです。対象レイアウトに合わせてビューポート幅を変更してください。
データはサーバーに送信されますか？
いいえ。すべての変換はブラウザ内で完結します。データは端末の外に出ません。