What are invisible characters?

Invisible characters are Unicode code points that have no visible glyph but still occupy space in a string and influence how software processes or renders text. They include control characters (like tab and line feed), format characters (like zero-width joiners and directional marks), various whitespace variants, and special markers like the Byte Order Mark (BOM). Because they look like nothing, they are notoriously hard to spot in a plain text editor and are a common source of subtle bugs, broken layouts, and data-processing errors.

Tool description

The Invisible Characters Viewer is an interactive text editor that renders every invisible character as a visible symbol, right in place. Paste or type any text and each hidden character is immediately replaced by a small symbolic glyph — tabs appear as →, spaces as ·, zero-width spaces as ·, directional marks as → / ←, BOM as ▯, and so on. Hovering over any glyph shows a tooltip with the character's full name and Unicode code point. Nothing leaves the editor; all rendering happens locally in your browser.

Examples

Input text (raw) What you see in the viewer
Hello\u200BWorld (zero-width space between words) Hello·World with the · glyph marking U+200B
\u202Eright-to-left override →right-to-left override with the directional glyph at the start
line one\r\nline two Carriage-return and line-feed glyphs before the newline
\uFEFFstart of file ▯start of file showing the BOM at position 0

Features

  • Inline rendering: Invisible characters are shown as glyphs directly inside the editor rather than in a separate panel, so you see them in context with the surrounding text
  • Broad character coverage: Handles C0 and C1 control characters, all named Unicode format characters, Unicode whitespace variants (en space, em space, hair space, narrow no-break space, etc.), directional formatting characters, variation selectors, tag characters, and BOM
  • Tooltips: Hovering over any glyph displays the character's full Unicode name and code point (e.g., Zero Width Space — U+200B)
  • Standard whitespace highlighting: Regular spaces and tabs are highlighted using CodeMirror's built-in whitespace markers, keeping them visually distinct from regular text
  • Plain-text mode: The editor stays in plain-text mode so special characters are never reinterpreted or modified as you type

Use cases

  • Debugging copy-paste artifacts: Text copied from PDFs, web pages, or word processors often carries zero-width spaces, soft hyphens, or non-breaking spaces that cause mismatches in string comparisons and search results
  • Inspecting data files: Paste CSV, JSON, or log output to locate unexpected control characters (null bytes, carriage returns, BOM) before importing data into a database or parser
  • Web and code debugging: Check user-supplied input or API responses for hidden directional marks or format characters that may break rendering or cause security issues

How it works

The tool uses CodeMirror 6 with a custom extension that iterates over every character in the editor's visible viewport. For each code point it checks a lookup table of known invisible characters, tests against Unicode property classes \p{Cc} (control) and \p{Cf} (format), and detects variation selectors and tag character ranges. Matched characters are replaced by inline decoration widgets showing the corresponding symbol glyph. Regular spaces and tabs are delegated to CodeMirror's built-in highlightWhitespace extension.