px→em (16px基準)

このツールでできること

• px→em (16px基準)では、CSS内のpx値を16px基準でemへ置き換え、小数4桁の相対値として確認する。
• 関連する観点として px→em (16px基準)、px to em、開発ツール を確認し、結果をコピーして別の作業に使えます。

使い方

1. px指定を含むCSS断片を「入力」欄に貼り付けます。
2. 小文字の px に続く数値だけが検出され、16で割ったem値へ自動置換されます。
3. 「結果」欄で 18px → 1.1250em のように小数4桁になっているか確認します。
4. 親要素のfont-sizeが16px以外のコンポーネントでは、採用前に基準差を別途見直します。

入力例・出力例

よくある利用シーン

• ボタンやカード内部の余白を、親font-sizeに追従するem指定へ置き換えたいとき。
• デザイン指示のpx値を、16px基準のem値としてレビュー資料に併記したいとき。
• remではなくコンポーネント単位で拡大縮小させたい寸法だけを抽出して確認したいとき。

結果確認のポイント

• 構文、引用符、改行、エスケープが利用先の仕様に合っているか確認してください。
• px→em (16px基準)、px to em、開発ツールの観点で、入力内容と出力内容がずれていないか見直してください。
• コピーした結果を利用先に貼り付けたあと、改行や記号が変わっていないかも確認してください。

注意点

• 本番の秘密情報、APIキー、パスワードは入力しないでください。
• 結果を公開・送信する前に、用途に合う形式かを必ず確認してください。

データの扱い / プライバシー

• px→em (16px基準)の主要な処理はブラウザ内で実行されます。
• 入力内容を保存するアカウント機能はなく、ページを閉じると作業内容は手元のブラウザから離れます。
• 本番の秘密情報や個人情報を扱う場合は、入力前に必要性を確認してください。

よくある質問

関連ツール