読み込み中...
px↔rem↔em↔vw↔vh全CSS単位を一括換算。Tailwind CSSのクラス名も同時表示このツールを使えば、複雑な計算も一瞬で完了します。結果を保存して、後で見返したりシェアしたりすることも可能です。
rem・em・vw・vhの換算に必要な環境値
フォントサイズ（text-*）
スペーシング（p-* / m-* / gap-* etc.）
ブレークポイント
マッチしたTailwindクラス
「CSS単位換算 + Tailwindマップ」は、CSSで使う全単位（px・rem・em・vw・vh・%・pt・pc・ch）を一括換算できるツールです。ルートフォントサイズ・ビューポートサイズ・コンテナ幅を設定することで正確な値を計算します。さらにTailwind CSSのフォントサイズ（text-sm等）・スペーシング（p-4等）・ブレークポイント（md:等）のクラス名が入力値に対応するものをハイライト表示します。
px基準値を中心に各単位へ換算します。rem = px ÷ ルートフォントサイズ、em = px ÷ コンテナ幅、vw = px ÷ ビューポート幅 × 100、vh = px ÷ ビューポート高さ × 100、pt = px × 72 ÷ 96（96dpiスクリーン基準）。Tailwindマッピングはv3デフォルト設定（1単位=4px, base=16px）に基づきます。