Limited support 注意が必要。一部のブラウザのみ対応。プロダクション利用は慎重に判断すること。

Hyphenate limit chars

hyphenate-limit-chars は CSS のプロパティで、単語のハイフネーションを許可する単語の最小の長さ、およびハイフンの前後の最小文字数を指定します。

このプロパティを使用すると、テキストのハイフネーションを細かく制御することができます。この制御機能により、不自然なハイフネーションを回避し、言語ごとに適切なハイフネーションを設定することが可能になり、結果としてより優れた字組みが実現します。

ハイフネーション文字数制限

対応ブラウザ

1+対応 (バージョン) 未対応 ※注釈ありサブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

CSS

.article {
  hyphens: auto;
  hyphenate-limit-chars: 6 3 2;
}

CSS の制限付きハイフンパターンです。

CSS の標準ハイフンパターンです。

CSS のハイフンなしパターンです。