フォント

font-kerning

font-kerning は、フォントに入っている情報を使って「AV」や「To」のような文字の組み合わせの間隔を詰める(カーニングする)かどうかを決めます。

構文

auto | normal | none

プレビュー

AV To
プリセット
右下の角をドラッグするとサイズを変えられます

コード

.box {
  font-family: Inter, sans-serif;
  font-kerning: normal;
}

コントロール

font-kerningnormal
font-kerning
AV To

解説

値の書き方

  • auto:カーニングするかどうかをブラウザが決めます。初期値です。このページで確かめた Chrome 141 では normal と同じでした。
  • normal:カーニングします。
  • none:カーニングしません。

カーニングは、字ごとの幅が違うフォントのためのものです。フォントにカーニングの情報が無ければ、どの値でも変わりません。letter-spacing を指定したときは、カーニングで詰めた間隔にさらに足されます。

このページのプレビューは、どの環境でも同じように見えるように、補助の宣言でサイトが読み込んでいる Inter にしています。「AV」と「To」の間が、none にすると広がります。

コメント