Unicode converter

The four counts are the point of this page, because the gap between them explains most Unicode bugs. A grapheme is what a person calls a character. A code point is what Unicode calls one. A UTF-16 code unit is what JavaScript’s .length counts. A UTF-8 byte is what a database column measures. For plain English all four are equal, which is why the problem stays hidden until the first emoji arrives.

Take 😀: one grapheme, one code point, two UTF-16 units and four UTF-8 bytes. So "😀".length is 2 in JavaScript, and slicing that string at position 1 splits it into two halves of a surrogate pair — neither of which is a character, which is how you get the replacement diamond in production. A family emoji is worse: one grapheme, five code points, eleven UTF-16 units.

That byte count is where database errors come from. A MySQL column declared utf8 holds three bytes per character, and every emoji needs four — which is why the column has to be utf8mb4, and why an emoji silently vanishing between a form and a page is nearly always this.

The escapes are given in all four forms because the syntax differs by more than notation. Above the Basic Multilingual Plane, JavaScript needs \u{1F600} with braces — the older \uXXXX form simply cannot express a code point above FFFF, and writing it is a silent bug rather than an error.