Unicode Inspector

How to Use the Unicode Inspector

This free online Unicode inspector breaks down any string character by character. Paste text into the input field and the tool instantly shows each grapheme cluster with its code point(s) in U+XXXX notation, the exact UTF-8 byte sequence in hex, the UTF-16 code units, and the Unicode block name. It also flags invisible characters such as zero-width spaces and BOMs that frequently break copied API keys, SQL queries, and configuration files.

Features

• Grapheme-aware segmentation via Intl.Segmenter — emoji ZWJ sequences like family emoji are treated as a single visible character
• Code point, UTF-8 bytes, and UTF-16 code units for every character
• Detection of ZWSP (U+200B), BOM (U+FEFF), NBSP (U+00A0), ideographic space (U+3000), and control characters, with position information
• NFC / NFD normalization comparison to spot decomposed dakuten (e.g. か + U+3099 vs が)
• Four length counts at a glance: graphemes, code points, UTF-16 units, UTF-8 bytes
• Runs entirely in your browser — no text ever leaves your device

What is a code point, and why do emoji count as more than one character?

A code point is the number Unicode assigns to a character, written as U+XXXX. JavaScript's string.length counts UTF-16 code units instead, so an emoji like 👍 (U+1F44D) reports a length of 2, and a family emoji joined with zero-width joiners can report 11. When you need the length a human would expect — for SNS character limits or text truncation — count grapheme clusters, which is exactly what the first counter in this tool shows.

Unicode Inspectorの使い方

テキストを入力欄に貼り付けるだけで、各文字のコードポイント(U+XXXX)・UTF-8バイト列・UTF-16コードユニット・Unicodeブロック名を一覧表示します。書記素クラスタ単位で分割するため、ZWJで結合された家族絵文字なども「見た目の1文字」として正しく扱われます。ゼロ幅スペースやBOMなどの不可視文字が含まれている場合は、位置と種類を警告として表示します。

実務での活用例

1. コピペした認証キーが「Invalid」になる原因調査

WebページやチャットからコピーしたAPIキー・トークンには、ゼロ幅スペース(U+200B)やBOM(U+FEFF)が紛れ込むことがあります。見た目では完全に一致しているのに認証が通らない場合、本ツールに貼り付ければ「コピペバグの原因になる文字が N 個見つかりました」と位置付きで検出できます。エディタの検索では見つけられない不具合の特定に有効です。

2. 文字化け・文字列比較バグの調査

「同じ文字列なのに === や SQL の比較が一致しない」というバグは、NFC/NFD の混在が原因のことがあります。macOSからアップロードされたファイル名は「が」を「か + 結合用濁点(U+3099)」と分解した NFD 形式で持つため、Windows由来の NFC 文字列と一致しません。本ツールの NFC/NFD 比較表示で、入力がどちらの形式かを即座に判定できます。また、UTF-8バイト列の表示は、DBやログで発生した文字化けがどの段階でのエンコーディング誤りかを切り分ける手がかりになります。

3. SNS・DBの文字数制限と絵文字のバイト数確認

X(Twitter)の文字数カウントや DB の VARCHAR 制限は、見た目の文字数と一致しません。家族絵文字 👨‍👩‍👧‍👦 は見た目1文字でも、コードポイント7個・UTF-16で11ユニット・UTF-8で25バイトを消費します。投稿前のバイト数確認や、MySQL の utf8(3バイトまで)で絵文字が保存できない問題の検証に使えます。

よくあるエラーと対処 / Common Errors and Fixes

不可視文字・正規化・エンコーディングが原因で起こる典型的な症状と対処をまとめました。

Typical symptoms caused by invisible characters, normalization mismatches, and encoding issues.

言語別コード例 / Code Examples by Language

このツールの検査処理をコードで再現する最小サンプルです。

Minimal snippets that reproduce what this inspector does.

JavaScript / TypeScript

// コードポイント / Code points
for (const ch of "が👍") {
  console.log("U+" + ch.codePointAt(0)!.toString(16).toUpperCase());
}

// UTF-8 バイト列 / UTF-8 bytes
const bytes = new TextEncoder().encode("が"); // Uint8Array [227, 129, 140]

// 書記素クラスタ数 / Grapheme count (emoji-safe)
const seg = new Intl.Segmenter("ja", { granularity: "grapheme" });
const count = [...seg.segment("👨‍👩‍👧‍👦")].length; // 1

// NFC 正規化 / Normalize to NFC
const nfc = "か\u3099".normalize("NFC"); // "が" (U+304C)

Python

import unicodedata

for ch in "が👍":
    print(f"U+{ord(ch):04X}", unicodedata.name(ch, "Other"))

# UTF-8 バイト列 / UTF-8 bytes
print("が".encode("utf-8").hex(" "))  # e3 81 8c

# NFC 正規化 / Normalize to NFC
nfc = unicodedata.normalize("NFC", "か\u3099")  # "が"

Go

import (
    "fmt"
    "unicode/utf8"
)

s := "が👍"
for _, r := range s { // range はルーン(コードポイント)単位
    fmt.Printf("U+%04X ", r)
}
fmt.Println(utf8.RuneCountInString(s)) // 2 (コードポイント数)
fmt.Println(len(s))                    // 7 (UTF-8 バイト数)

Shell

# UTF-8 バイト列を確認 / Show UTF-8 bytes
printf 'が' | xxd
# 00000000: e381 8c

# コードポイントを確認 / Show the code point
python3 -c 'print(hex(ord("が")))'  # 0x304c

Before / After 実例 / Before & After

例1: ZWSP混入キーの検出 / Detect a ZWSP inside a pasted key

入力 / Input:  sk-abc[U+200B]def  (見た目は "sk-abcdef")

↓

警告: コピペバグの原因になる文字が 1 個見つかりました
7文字目: U+200B ZWSP — ゼロ幅スペース

例2: NFD の濁点分解を発見 / Spot NFD decomposed dakuten

入力 / Input:  が  (macOSのファイル名由来)
コードポイント: U+304B U+3099  (か + 結合用濁点)
UTF-8: E3 81 8B E3 82 99  (6 バイト)

↓ normalize("NFC")

コードポイント: U+304C  (が 合成済み)
UTF-8: E3 81 8C  (3 バイト)

例3: 絵文字のサイズを実測 / Measure an emoji sequence

入力 / Input:  👨‍👩‍👧‍👦  (家族の絵文字)
書記素:            1  (見た目の文字数)
コードポイント:     7  (U+1F468 U+200D U+1F469 U+200D U+1F467 U+200D U+1F466)
UTF-16 ユニット:   11  (JavaScript の .length)
UTF-8 バイト:      25

Why browser-only? / なぜブラウザ完結か

The strings you inspect with this tool are often the ones you least want to share: API keys that mysteriously fail authentication, passwords with suspected invisible characters, customer names from a database with mojibake, or file paths from an internal system. Sending such text to a server-side analyzer means handing that sensitive data to a third party just to read its bytes. This inspector uses only standard browser APIs —codePointAt, TextEncoder, String.prototype.normalize, and Intl.Segmenter — so every byte is computed locally in your browser. No network request is made when you type or paste. You can verify this yourself: open DevTools, switch to the Network tab, paste a string, and watch the tab stay empty.

このツールで検査する文字列は、認証に失敗するAPIキー、不可視文字が疑われるパスワード、文字化けした顧客名など、外部に出したくないものがほとんどです。DevToolBox は TextEncoder や Intl.Segmenter などブラウザ標準APIのみで全処理をローカル実行するため、入力内容がネットワークに送信されることは一切ありません。DevTools の Network タブが空のままであることで確認できます。

制限事項 / Limitations

• Unicodeブロック名は主要な約45ブロックのみ収録しています。それ以外の範囲は「Other」と表示されます。
• 文字一覧の表示は先頭300文字(書記素)までです。統計(文字数・バイト数)は全文を集計します。
• Intl.Segmenter 非対応の古いブラウザでは、コードポイント単位の分割にフォールバックします(絵文字シーケンスが複数行に分かれます)。