px ⇔ rem — Bulk Converter

px ⇔ rem コンバーター CSSを貼り付けるだけで、px値をまとめてremに(またはその逆に)変換

コメントや url() の中身は変換対象から除外します。1pxの枠線だけ変換しない、といった実務的なオプションにも対応しています。

値の変換のみを行い、プロパティの意味やセレクタ構造は変更しません。line-heightの無単位指定(例: 1.5)はpx表記ではないため対象外です。

よく使う値の早見表(基準サイズに連動)

既知の制限

💡 px ⇔ rem 換算の基準とWebアクセシビリティ

■ なぜ px 直書きではなく rem 単位が推奨されるのか?

px は画面解像度に依存する絶対単位です。ユーザーがブラウザの環境設定でデフォルト文字サイズ(例: 20px)に拡大設定を行っている場合、px で固められたテキストはユーザー設定を無視して縮小されたままになってしまいます。
一方、rem(Root EM)はルート要素(html)のフォントサイズに対する相対比率で計算されるため、ユーザーのブラウザ文字サイズ設定に柔軟に追従し、アクセシビリティ適合(WCAG 2.1)を達成できます。

■ 換算の計算ロジック(16px = 1rem)

一般的なブラウザのデフォルト文字サイズは 16px です。この場合、1rem = 16px1.5rem = 24px0.875rem = 14px となります。本コンバーターでは基準サイズ(デフォルト16px)を自由に切り替えて一括置換・変換が可能です。