CSS Unit Converter

概要

• px・rem・em・ptの間でCSSの単位を相互に変換するツールです。

• rem・emとpx間の変換には基準フォントサイズ（初期値16px）を使用します。サイトのルート要素のフォントサイズが異なる場合は、その値に変更して計算できます。

• 1つの数値を入力するだけで、4つの単位すべての値が一度に表示されます。

使い方

1. 1

   「値」に変換したい数値を入力します。

2. 2

   「変換元の単位」でpx・rem・em・ptのいずれかを選択します。

3. 3

   rem・emへ変換する場合の基準となる「基準フォントサイズ」を指定します（初期値は16px）。

4. 4

   「変換する」ボタンをクリックすると、4つの単位すべての値が表示されます。

入力例・出力例

16px(基準フォントサイズ16px)

1rem / 1em / 12pt

利用シーン

• デザインカンプに記載されたpx単位の数値を、rem単位でのCSS実装に変換する

• 印刷物やPDFで使われるpt単位の数値を、Web制作で使うpx・rem単位に変換する

• ルート要素のフォントサイズを変更したプロジェクトで、既存のpx値をremへ計算し直す

よくある質問

注意点

• emはrem同様に基準フォントサイズを基準として計算しています。実際のemは親要素のフォントサイズに依存するため、厳密な値とは異なる場合があります。

• ptはCSS仕様の定義（1in = 96px = 72pt）に基づいて変換しています。

• 基準フォントサイズはrem・emとpx間の変換にのみ使用され、ptの変換には影響しません。