CSS のタイポグラフィから Tailwind へ
font-size: 1.5rem → text-2xl。font-weight: 700 → font-bold。色は text-*。
タイポグラフィは対応が明快です。font-size: 1.5rem は text-2xl、font-weight: 700 は font-bold になります。ただし text- はサイズと色の両方に使われ、長いクラスでは読み違いに注意が必要です。
サイズと line-height
font-size + line-height は多くの場合 text-* / leading-*。ブランド固有の leading なら leading-[…]。
ウェイトと tracking
font-weight 600 → font-semibold。細かい負の letter-spacing は任意 tracking になりやすい。
ランプを無理に寄せない
13px のタイポを「最寄り」トークンに丸めると視覚階層が壊れうる。
試す
.example { display: flex; gap: 1rem; padding: 1rem; }信頼メモ: 出力は視覚確認を。コンバーターは下書き用ヘルパーです。