Por qué 'Muñoz' en negritas Unicode sale como 𝐌𝐮ñ𝐨𝐳: la ñ, los acentos y los generadores de texto
Si alguna vez pegaste tu nombre en un generador de "fuentes" para Instagram y te salió 𝐉𝐨𝐬é en vez de todo en negritas, no es un bug del generador. Es una limitación de Unicode, y entenderla ayuda a decidir qué hacer con
Si alguna vez pegaste tu nombre en un generador de "fuentes" para Instagram y te salió 𝐉𝐨𝐬é en vez de todo en negritas, no es un bug del generador. Es una limitación de Unicode, y entenderla ayuda a decidir qué hacer con el texto en español.
Esas "fuentes" no son fuentes
Un generador de texto decorado no cambia la tipografía. Sustituye cada letra por otro carácter que se parece a la letra con estilo. La mayoría salen del bloque Mathematical Alphanumeric Symbols (U+1D400–U+1D7FF):
// 'a' (U+0061) -> '𝐚' (U+1D41A, MATHEMATICAL BOLD SMALL A)
const toBold = (s) =>
[...s].map((ch) => {
const c = ch.codePointAt(0);
if (c >= 0x61 && c <= 0x7a) return String.fromCodePoint(0x1d41a + (c - 0x61));
if (c >= 0x41 && c <= 0x5a) return String.fromCodePoint(0x1d400 + (c - 0x41));
return ch; // todo lo demás se queda igual
}).join('');
toBold('Muñoz'); // "𝐌𝐮ñ𝐨𝐳"
El bloque se creó para notación matemática y solo incluye A–Z, a–z, algunos griegos y dígitos. No existe un "𝐧 con tilde" ni una "𝐞 con acento" matemática. Por eso la ñ, la é o la ü se quedan como letras normales.
¿Y si descompongo la letra?
La idea obvia es normalizar a NFD, separar la base del diacrítico y poner en negritas solo la base:
'é'.normalize('NFD'); // 'e' + U+0301 (COMBINING ACUTE ACCENT)
toBold('é'.normalize('NFD')); // '𝐞' + U+0301
Técnicamente funciona, pero en la práctica es mala idea:
- El render es inconsistente. Muchas fuentes de sistema no posicionan bien un acento combinante sobre un carácter matemático. En varios Android el acento queda flotando o desplazado, y a veces aparece como un cuadrito.
- Rompe búsquedas y copiado. El texto ya no coincide con "é" precompuesta, y algunas apps (y juegos) filtran los combining marks.
- Lectores de pantalla. VoiceOver y TalkBack ya leen raro los caracteres matemáticos. Con marcas combinantes, peor.
Lo que sí recomiendo
- Conservar la letra precompuesta (é, ñ, ü) sin estilo. Visualmente se nota poco en negritas o cursivas y nunca se rompe. Es lo que hacen los generadores bien hechos.
- Usar estilos con cobertura amplia (negrita, itálica, gótica) para texto en español, porque se mezclan mejor con letras normales que las cursivas caligráficas.
-
Iterar por code points, no por unidades UTF-16 (
[...s], nos.split('')). Si no, partes los pares sustitutos. -
Reversibilidad: si tu app recibe texto decorado, normaliza con NFKC para buscar o indexar.
'𝐌𝐮ñ𝐨𝐳'.normalize('NFKC')devuelve'Muñoz'.
Si quieres ver el comportamiento con nombres reales, en Letras Bonitaas hay una guía de letras con acentos y ñ con ejemplos como 𝓙𝓸𝓼é, 𝐩𝐢𝐧𝐠ü𝐢𝐧𝐨 y ¡𝐇𝐨𝐥𝐚!, y el generador aplica justo esa regla: la letra que no tiene versión decorada se queda normal.
¿Alguien ha encontrado una fuente de sistema que posicione bien U+0301 sobre el bloque matemático? Me interesa saber en qué dispositivos lo probaron.
Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.