Unicode U+200B : Zero Width Space- Complete Guide

Note: This is an invisible zero-width space - displayed with a border for visibility

Shortcodes

Copy and paste shortcodes for Zero Width Space.

Symbol
Unicode	U+200B
Alt Code	8203
HTML Code
HEX Code
CSS Code	\200B
UTF-8	0xE2 0x80 0x8B
UTF-16	0x200B
UTF-32	0x0000200B

Character Details

Name: Zero Width Space (ZWSP)

Alternative Names: ZWSP

Block:General Punctuation (U+2000 - U+206F)

Plane: Basic Multilingual Plane (BMP)

Script: Common

Category: Format (Cf)

Character Mirrored: No

Is Whitespace: No (technically)

About Zero Width Space (ZWSP)

The Zero Width Space (ZWSP) is an invisible, non-printing character that literally has zero width. Unlike a regular space or non-breaking space which creates visible separation between characters, the zero width space is completely invisible and takes up no space on the screen. However, it still exists as a character in the text and can significantly affect how text is rendered and processed.

In web design and digital typography, ZWSP is a powerful tool for controlling line breaks and text wrapping. It's represented by the HTML entity  and serves as an invisible "soft break opportunity" in text.

Key Purpose: ZWSP enables line breaks at specific positions without inserting visible characters. It tells browsers and text processors "you can break the line here if needed," making it essential for handling long URLs, compound words, and technical terms that would otherwise overflow containers or create awkward layouts.

How It Works:

Unlike a regular space (U+0020) which creates visible separation, or a non-breaking space (U+00A0) which prevents line breaks, the zero width space is invisible but provides a location where text CAN break if necessary. Think of it as an invisible suggestion to the text rendering engine: "If you need to break this line, here's a good spot."

Common Uses:

Long URLs: https://example.com/very/long/url/path/that/needs/breaking
Compound Words: supercalifragilisticexpialidocious
Technical Terms: polymorphismInheritanceEncapsulation
CamelCase Words: JavaScriptVariableNameExample
Email Addresses: verylongemailaddress@example.com
Code Snippets: Allowing long function names or paths to wrap gracefully
Preventing Search: Breaking up words to avoid keyword matching (controversial use)
Social Media: Preventing automatic hashtag or mention linking

Web Development Applications:

Controlling line breaks in responsive designs
Managing text overflow in narrow containers
Improving mobile readability for long technical terms
Creating soft hyphens without visible characters
Handling dynamic content that might have unpredictable length

Zero Width Space vs. Other Spaces:

Feature	Regular Space (U+0020)	Non-Breaking Space (U+00A0)	Zero Width Space (U+200B)
Visible	Yes (creates space)	Yes (creates space)	No (invisible)
Has Width	Yes	Yes	No (zero width)
Allows Line Break	Yes	No	Yes
Primary Use	Word separation	Keep words together	Enable breaking without visible gap

⚠️ Important Note:

While ZWSP is incredibly useful, it can also cause problems. Invisible characters in code can create difficult-to-debug issues, and they can interfere with text searches, string comparisons, and data validation. Use ZWSP intentionally and document its use in your projects. Some systems may strip or reject ZWSP characters for security reasons, as they've been used in homograph attacks and to bypass content filters.

How to type Zero Width Space?

To type the using the keyboard you can use the Alt code from the shortcode section. Here are the simple steps to type the using Alt code from your keyboard. Make sure you switch on the Num Lock from the keyboard and you type the number from the Numpad and not from the top row of the keyboard.

Hold down the left Alt Key from your keyboard.
Type the Alt code number 8203 and release the Alt key.

Once you release the Alt key, the symbol will be displayed (though it will be invisible!).

Alternative Methods:

Windows: Alt + 8203 (on numpad)
Mac: Not available via keyboard shortcut (use copy/paste or character viewer)
Linux: Ctrl + Shift + U, then type 200B and press Enter
HTML: Type  in your code
Copy & Paste: Simply click the copy button above (easiest method!)

💡 Pro Tip:

Since ZWSP is invisible, it's easy to accidentally insert one and not realize it. Many code editors have settings to show invisible characters. In VS Code, you can enable "Editor: Render Whitespace" to see these characters. This can save hours of debugging when mysterious characters cause issues in your code!

How to add Zero Width Space in HTML?

To add the Zero Width Space in HTML, you can use an HTML entity, an HTML code (decimal), and a Hex code. The HTML entity  is the most commonly used method. Here are the examples:

// HTML code example (Decimal) - Most common


                            <p>Thisisaverylongword</p>

// HEX code example


                            <p>https://example.com/long/url/path</p>

// Practical URL breaking example


                            <p>Visit: https:&#8203;//&#8203;www&#8203;.example&#8203;.com&#8203;/very&#8203;/long&#8203;/path&#8203;/name</p>

All the above examples will insert invisible Zero Width Spaces that allow the text to break naturally on smaller screens without inserting visible characters.

Output:

Visit: https://www.example.com/very/long/path/name

(Text can break at invisible ZWSP positions)

How to add Zero Width Space in CSS?

To display the Zero Width Space from CSS, you can use a CSS escape code. You can add content :before or :after an element. Here is the example:

// CSS code example

.zwsp-after:after {
  content: '\200B';
}

/* Insert ZWSP between camelCase words */
.break-camelcase::before {
  content: '\200B';
}

/* Add multiple ZWSPs for better breaking */
.multi-zwsp::after {
  content: '\200B\200B\200B';
}

// The HTML

<span class="zwsp-after">VeryLong</span>Word
<div class="break-camelcase">CamelCaseVariable</div>

The above CSS will add invisible zero-width spaces after the elements, creating break opportunities for long words or URLs.

🎨 CSS Tip:

You can also use the CSS word-break or overflow-wrap properties as alternatives to ZWSP for controlling text breaking behavior. However, ZWSP gives you precise control over exactly where breaks can occur.

‧₊˚✩彡
Aesthetic ⓵
Numbers •
Dot ☎
Phone ♂
Gender ➔
Arrows │
Line 🎀
Birthday ❗
Exclamation ☛
Bullet Point ♥
Heart ★
Star √
Tick ☒
X Mark 「」
Quotation ⦃⦄
Bracket ʘ‿ʘ
Kaomoji 🕛
Time 🏔
Mountain ☀️
Summer 🌧️
Rain ───✧❁✧───️
Divider 🌩
Cloud 🛠
Tools 👑
Crown ⚲
Location ⁇
Question Mark ≋
Tilde ⌛
Bowtie ‽
Interrobang ☟
Manicule ‡
Dagger ⧫
Diamond ❦
Hedera ☸
Peace 🎯
Target 🏹
Bow 🌜
Moon ☣
Biohazard ≈
Approximately ±
Plus Or Minus ∞
Infinity <
Less Than Σ
Greek Letter ≠
Math ©
Copyright

Unicode Zero Width Space (U+200B)