Hyphenate limit chars
The hyphenate-limit-chars CSS property specifies the minimum word length to allow hyphenation of words as well as the minimum number of characters before and after the hyphen.
This property provides you with fine-grained control over hyphenation in text. This control enables you to avoid awkward hyphenations and set appropriate hyphenation for different languages, which, in turn, allows for better typography.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 109 | 109 | 137 | | 109 | | |
auto | 109 | 109 | 137 | | 109 | |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
CSS
.article {
hyphens: auto;
hyphenate-limit-chars: 6 3 2;
} Live demo
Use cases
-
Refine text rhythm
Use Hyphenate limit chars to make long-form reading or dense interface copy easier to scan and understand.
-
Support language nuances
Apply Hyphenate limit chars when different writing systems or typographic conventions need more deliberate control.
Cautions
- Test Hyphenate limit chars in the browsers you support, especially if it changes layout, text handling, or interaction behavior.
- Plan a fallback or acceptable degradation path when support is still limited.
Accessibility
- Check readability with zoom, narrow screens, and mixed-language content so text remains understandable.