Hyphenate limit chars
単語がハイフネーションされるための最小文字数を制御し、短すぎる分割を防ぎます。ハイフンの前後に残す最小文字数も指定でき、読みやすさを損なわないハイフネーションルールを設定できます。高品質な文字組みを実現するための重要なプロパティです。
概要
単語がハイフネーションされるための最小文字数を制御し、短すぎる分割を防ぎます。ハイフンの前後に残す最小文字数も指定でき、読みやすさを損なわないハイフネーションルールを設定できます。高品質な文字組みを実現するための重要なプロパティです。
対応ブラウザ
デスクトップ
Chrome 109+
Edge 109+
Safari 未対応
Firefox 137+
モバイル
Chrome Android 109+
Safari iOS 未対応
Firefox Android 137+
基本構文
CSS
.article {
hyphens: auto;
hyphenate-limit-chars: 6 3 2;
}実務での使いどころ
-
読みやすいハイフネーションルールの設定
短い単語のハイフネーションを防止し、ハイフンの前後に十分な文字を残すことで、テキストの可読性を維持します。
注意点
- 2026年3月時点でSafariではサポートされていません。Chrome/EdgeとFirefoxで利用可能です。
アクセシビリティ
- 過度なハイフネーションは読みにくさの原因となるため、適切な最小文字数を設定して認知負荷を軽減してください。