Menu

How Fancy Letters Really Work: A Developer's Tour of Unicode's Hidden Alphabets
๐Ÿ“ฐ

How Fancy Letters Really Work: A Developer's Tour of Unicode's Hidden Alphabets

DEV Community: javascriptยทLetras Bonitasยทabout 7 hours ago
#Y1MhMgZp
#devtojavascript#devto#dev#letters#bold
Reading 0:00
15s threshold

You've seen it in Instagram bios, Discord names and game nicknames: ๐›๐จ๐ฅ๐, ๐˜ช๐˜ต๐˜ข๐˜ญ๐˜ช๐˜ค, ๐“ˆ๐’ธ๐“‡๐’พ๐“…๐“‰, ๐”ฃ๐”ฏ๐”ž๐”จ๐”ฑ๐”ฒ๐”ฏ, โ“’โ“˜โ“กโ“’โ“›โ“”โ““, ๏ฝ†๏ฝ•๏ฝŒ๏ฝŒ๏ฝ—๏ฝ‰๏ฝ„๏ฝ”๏ฝˆ and tฬทฬขอ™hฬถฬคอiฬตอšอ‘sฬธฬฑฬพ kind of chaos, all pasted into fields that only accept plain text.

None of that is a font. No CSS, no rich text, no <b> tag. Every one of those glyphs is its own Unicode code point, and the "fancy text generators" all over the web are mostly lookup tables. This post goes through the blocks those characters come from, why the alphabets have strange gaps, and what they cost you in accessibility and searchability.

Fonts vs. characters

Normally "bold" is presentation. The character A (U+0041) stays the same, and your font or CSS decides how heavy it looks. Copy it somewhere else and the boldness is gone.

Fancy text works the other way. ๐€ is U+1D400 MATHEMATICAL BOLD CAPITAL A , a separate character from A .โ€ฆ

Continue reading โ€” create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.