単一の値
px
px
rem
一般的な変換
仕組み
Rem units are relative to the root element font size. With the default 16px base, 1rem equals 16px and 0.5rem equals 8px.
rem = px / base font size
CSS 変数ヘルパー
ピクセルの間隔値から CSS カスタムプロパティを生成します。
px・rem相互変換とは何ですか？
設定可能なルートフォントサイズを基準に、CSS の px と rem を相互変換します。 px または rem 値とルートフォントサイズ。必要に応じて CSS 変数用のカンマ区切り値。 変換値、代表的な換算例、必要に応じた CSS カスタムプロパティ宣言。
ツールを開く
このツールでできること
- 入力: px または rem 値とルートフォントサイズ。 必要に応じて CSS 変数用のカンマ区切り値。
- 設定と処理: px→rem／rem→px 切替、既定16 pxの基準値変更、CSS Variables Helper。
- 出力: 変換値、代表的な換算例、必要に応じた CSS カスタムプロパティ宣言。
使い方
- 入力を追加する。 px または rem 値とルートフォントサイズ。 必要に応じて CSS 変数用のカンマ区切り値。
- 設定を確認する。 px→rem／rem→px 切替、既定16 pxの基準値変更、CSS Variables Helper。
- 生成・確認・書き出しを行う。 変換値、代表的な換算例、必要に応じた CSS カスタムプロパティ宣言。
主な機能
- 入力: px または rem 値とルートフォントサイズ。 必要に応じて CSS 変数用のカンマ区切り値。
- 設定と処理: px→rem／rem→px 切替、既定16 pxの基準値変更、CSS Variables Helper。
- 出力: 変換値、代表的な換算例、必要に応じた CSS カスタムプロパティ宣言。
活用シーン
- 設定可能なルートフォントサイズを基準に、CSS の px と rem を相互変換します。
- 次の出力・診断結果が必要な場面で使います：変換値、代表的な換算例、必要に応じた CSS カスタムプロパティ宣言。
- 次の確認済み工程の前に配置します：プロジェクトの実際のルートサイズとズーム設定で確認。
制限と安全上の注意
- 式は rem = px ÷ ルートフォントサイズです。 16 px は一般的な既定値にすぎず、実際の computed root size は CSS や利用者設定で変わります。
トラブルシューティング
- 数値だけを入力し、小数点記号、変換元・変換先単位、base／root size、DPI、許容範囲を確認してください。
- 既知の基準値を1つ再計算し、前提と丸め方を確認してから一括変換や CSS・印刷への適用を行ってください。
- 式は rem = px ÷ ルートフォントサイズです。 16 px は一般的な既定値にすぎず、実際の computed root size は CSS や利用者設定で変わります。
よくある質問
px・rem相互変換とは何ですか？
設定可能なルートフォントサイズを基準に、CSS の px と rem を相互変換します。
px・rem相互変換はどう使いますか？
想定された入力を追加し、ページ設定を確認してから、コピーまたはダウンロード前に結果を検証します。 想定出力：変換値、代表的な換算例、必要に応じた CSS カスタムプロパティ宣言。
どの入力に対応していますか？
px または rem 値とルートフォントサイズ。 必要に応じて CSS 変数用のカンマ区切り値。
どのような出力を生成しますか？
変換値、代表的な換算例、必要に応じた CSS カスタムプロパティ宣言。
どのような制限がありますか？
式は rem = px ÷ ルートフォントサイズです。 16 px は一般的な既定値にすぎず、実際の computed root size は CSS や利用者設定で変わります。
関連する AppKiro ツール
確認済みのサンプルから始める
小さく機密性のないサンプルで主要設定と出力を確認してから、実際のワークフローへ適用してください。
ツールを開く