Code points, graphemes, UTF-16 units and UTF-8 bytes
Choose the right Unicode count for emoji, combining accents and text limits. Compare worked examples in code points, graphemes, UTF-16 units and UTF-8 bytes.
ON THIS PAGE
A character limit needs a unit
A form that says “10 characters” has not told you enough to predict whether an emoji will fit. A writer may mean visible text units; JavaScript may count string units; a file limit may count encoded bytes. Ask which unit the destination enforces, then measure the same unit. The inspector reports several counts so you can see why they differ.
| Measurement | Useful question | Important limit |
|---|---|---|
| Grapheme clusters | How is this browser segmenting the text for user-facing units? | A cluster is not a guarantee of one glyph or one visual cell. |
| Code points | How many Unicode values make up the string? | An emoji sequence can contain several values. |
| UTF-16 units | How long is the JavaScript string? | Supplementary values occupy two units. |
| UTF-8 bytes | How large is the text encoded as UTF-8? | This excludes a file BOM and other file-format overhead. |
Compare short strings
| Actual text / notation | Graphemes | Code points | UTF-16 units | UTF-8 bytes |
|---|---|---|---|---|
| A | 1 | 1 | 1 | 1 |
| é (U+00E9) | 1 | 1 | 1 | 2 |
| e + U+0301 | 1 | 2 | 2 | 3 |
| 😀 | 1 | 1 | 2 | 4 |
| 👩 + ZWJ + 💻 | 1 | 3 | 5 | 11 |
| ❤ + VS16 | 1 | 2 | 2 | 6 |
é 👩💻 A BThe complete sample has 7 grapheme clusters, 10 code points, 12 UTF-16 units and 20 UTF-8 bytes in the tested browser. Spaces count too. The no-break space between A and B is U+00A0 and contributes two UTF-8 bytes. Selecting a cluster narrows the code-point table; the summary still describes the complete input.
Measure for the destination
Identify the contract
Check whether the form or API documents bytes, code points, UTF-16 units or grapheme clusters. Do not infer it from the word character alone.
Inspect the exact draft
Paste the text you actually intend to submit, including spaces and line breaks. Choose Inspect text and read the matching measurement.
Test the final destination
Submit a harmless test where appropriate. A service can apply its own validation, normalization or counting rule after the browser accepts the text.
Avoid cutting through a sequence
Truncating a JavaScript string at an arbitrary unit can split a surrogate pair; truncating by code point can still separate a base letter from an accent or break a joined emoji. A grapheme boundary is a better starting point for many user-facing truncation tasks, but the language and destination still determine the right behavior. GlyphIndex measures the input and leaves editing to you.
The inspector’s input limit is 10,000 UTF-16 units, not 10,000 emoji. Grapheme segmentation comes from your browser and can differ by browser Unicode version. Unicode names use the site’s pinned data. Invalid UTF-16 is flagged rather than silently counted as replacement-character UTF-8 bytes. These measurements are about the pasted text, not the size of an HTML page, spreadsheet or compressed file.
Sources and method
- Unicode Standard Annex #29: Unicode Text Segmentation — Extended grapheme clusters and their limits.
- Unicode FAQ: UTF-8, UTF-16, UTF-32 and BOM — Encoding units, well-formed text and byte order marks.
- MDN: String length — JavaScript length counts UTF-16 code units.
- Unicode Technical Standard #51: Unicode Emoji — Joiners and presentation selectors in emoji sequences.