Widely available YES。主要ブラウザで広く対応済み。本番利用を推奨。

概要

フォントに組み込まれたカーニング情報(文字ペア間の間隔調整データ)の使用を制御するプロパティです。auto、normal、noneの3つの値を持ち、タイポグラフィの品質に直接影響します。特に見出しや大きなテキストでは、カーニングの有無が読みやすさに大きく影響します。

対応ブラウザ

デスクトップ

Chrome 33+
Edge 79+
Safari 9+
Firefox 32+

モバイル

Chrome Android 33+
Safari iOS 9+
Firefox Android 32+

基本構文

CSS
h1, h2 {
  font-kerning: normal;
}
.monospaced {
  font-kerning: none;
}

実務での使いどころ

  • 見出しのタイポグラフィ最適化

    大きなフォントサイズの見出しでカーニングを有効にし、AV、WAなどの文字ペアの間隔を美しく調整します。

注意点

  • カーニングの適用はパフォーマンスに影響する場合があるため、大量のテキストノードでの使用は慎重に検討してください。

アクセシビリティ

  • カーニングは視覚的な美しさのためのものであり、スクリーンリーダーには影響しません。letter-spacingとの併用で読みやすさを調整できます。