SymbolFYI

Zero-Width Space

Typography
Définition

An invisible Unicode character (U+200B) that indicates a possible line break point without displaying any visible space.

The zero-width space (ZWSP) is a Unicode character at code point U+200B that occupies no visible width but signals to text rendering engines that a line break is permitted at that position. It is part of a family of zero-width characters in Unicode and is particularly useful for controlling line-breaking behavior in languages or contexts where word boundaries are not separated by visible spaces.

Why ZWSP Exists

In continuous scripts such as Thai, Khmer, Japanese, and Chinese, words are not separated by spaces -- text flows as an unbroken sequence of characters. Without explicit break opportunities, browsers will only break lines at punctuation or existing whitespace, which can cause text to overflow its container. ZWSP provides a way to insert break points without adding visible spacing.

The same problem arises in English with long URLs, file paths, or code snippets inside prose text:

<!-- Without ZWSP, this URL may overflow narrow containers -->
<p>See https://example.com/very/long/path/to/some/resource/file.html</p>

<!-- ZWSP after each slash gives the browser break opportunities -->
<p>See https://example.com/&#x200B;very/&#x200B;long/&#x200B;path/</p>

HTML Entity and Insertion

<!-- HTML entity (hex) -->
&#x200B;

<!-- HTML entity (decimal) -->
&#8203;

<!-- JavaScript string -->
const zwsp = '\u200B';
const breakable = text.split('/').join('/\u200B');

CSS Alternative: word-break and overflow-wrap

For many use cases, CSS provides cleaner solutions that do not require modifying the underlying text:

/* Allow breaking at any character boundary */
.breakable {
  word-break: break-all;
}

/* Break long words only when necessary to prevent overflow */
.url-container {
  overflow-wrap: break-word;
  word-break: break-word;
}

/* Use soft hyphens via CSS hyphens property */
.hyphenated {
  hyphens: auto;
  -webkit-hyphens: auto;
}
Character Code Point Description
ZWSP U+200B Zero-width, allows line break
ZWNJ U+200C Zero-width, prevents joining (ligature/cursive)
ZWJ U+200D Zero-width, forces joining (used in emoji sequences)
WJ U+2060 Word Joiner -- zero-width, prevents line break
NBSP U+00A0 Non-breaking space -- visible width, prevents line break

Security Considerations

ZWSP and other zero-width characters have been used in homograph attacks, invisible text injection, and watermarking schemes because they are visually undetectable. When processing user-supplied text, consider stripping or normalizing zero-width characters:

// Remove zero-width characters from user input
function stripZeroWidth(str) {
  return str.replace(/[\u200B-\u200D\uFEFF\u2060]/g, '');
}

ZWSP is also frequently found as an invisible artifact when copying text from PDFs, word processors, or certain web pages, causing unexpected behavior in string comparisons and search operations.

Symboles associés

Termes associés

Outils associés

Guides associés