I had a fella email me a line of text almost just like this:
𝐂𝐚𝐥𝐥𝐞 𝐁𝐥𝐚𝐧𝐜𝐨𝐬, 𝐂𝐨𝐬𝐭𝐚 𝐑𝐢𝐜𝐚
He said he could not remove that formatting no matter what he did. It looks kinda bold, doesn’t it? And set into a serif font. You’d think you could select it in the text editor you’re in and remove that formatting. He said he tried copy/pasting it into places where no text formatting is even allowed, like in VS Code or the URL bar of a browser. Voodoo, he said.
Here’s the thing: that text isn’t formatted.
That first “C” you see above isn’t a regular uppercase character C, our typical friend U+0043 : LATIN CAPITAL LETTER C, it’s “𝐂”, that is, U+1D402 : MATHEMATICAL BOLD CAPITAL C. It’s literally a different character in Unicode. There are… a lot of Unicode characters:
As of Unicode version 16.0, there are 155,063 characters with code points, covering 168 modern and historical scripts, as well as multiple symbol sets.
List of Unicode characters — Wikipedia
It could be written like 𝕮𝖆𝖑𝖑𝖊 𝕭𝖑𝖆𝖓𝖈𝖔𝖘, 𝕮𝖔𝖘𝖙𝖆 𝕽𝖎𝖈𝖆 instead, or 𝗖𝗮𝗹𝗹𝗲 𝗕𝗹𝗮𝗻𝗰𝗼𝘀, 𝗖𝗼𝘀𝘁𝗮 𝗥𝗶𝗰𝗮.
Should you do this to get super sweet effects in places you otherwise couldn’t? Probably not. The accessibility is rough. Listen to the audio output in this blog post. If you’re going to do it on the web where you have HTML control, do something like:
<span aria-label="Calle Blancos, Costa Rica">
<span aria-hidden="true">𝕮𝖆𝖑𝖑𝖊 𝕭𝖑𝖆𝖓𝖈𝖔𝖘, 𝕮𝖔𝖘𝖙𝖆 𝕽𝖎𝖈𝖆span>
span>Code language: HTML, XML (xml)UPDATE: See Ben’s comment on why not to do the above. Instead, make a visually hidden version that a screen reader would still see, and an ARIA hidden one that will be seen visually. (Noting potential concerns about copy/paste that started this whole article.)
<span class="visually-hidden">Calle Blancos, Costa Ricaspan>
<span aria-hidden="true">𝕮𝖆𝖑𝖑𝖊 𝕭𝖑𝖆𝖓𝖈𝖔𝖘, 𝕮𝖔𝖘𝖙𝖆 𝕽𝖎𝖈𝖆span>Code language: HTML, XML (xml)