Cómo usar: Generador de Guion Suave
- Pega tu titular o texto. En modo automático, las palabras más largas que el límite recibirán guiones suaves en los cortes silábicos probables.
- Para tener control total, escribe el marcador (por defecto
|) donde una palabra pueda cortarse, por ejemploVersicherungs|leistungen. - Arrastra el ancho de la vista previa para ver cómo se ajusta el texto en pantallas estrechas: el guion solo aparece donde la palabra realmente se corta.
- Copia como texto (caracteres invisibles, ideal para Webflow y campos de CMS) o como HTML con entidades
­.
¿Qué es un guion suave?
Un guion suave (Unicode U+00AD, entidad HTML ­) es un carácter invisible que marca un posible salto de línea dentro de una palabra. Si la palabra cabe en la línea, no se muestra nada. Si no cabe, el navegador corta la palabra en ese punto y muestra un guion. Es la solución más limpia para palabras compuestas largas, muy comunes en alemán («Kundenzufriedenheitsanalyse»), que se desbordan de su contenedor o quedan mal en titulares grandes del móvil.
Guion suave vs. espacio de ancho cero vs. hyphens de CSS
| Técnica | ¿Muestra guion? | Ideal para |
|---|---|---|
­ guion suave | Sí, solo al cortar | Palabras largas en encabezados y texto principal |
| Espacio de ancho cero (U+200B) | No | URLs, direcciones de correo, rutas de archivos, barras |
CSS hyphens: auto | Sí | Texto principal, pero necesita un atributo lang correcto y el diccionario del navegador, y no ofrece control |
CSS overflow-wrap: anywhere | No | Red de seguridad de último recurso; puede cortar palabras en lugares feos |
Usar guiones suaves en Webflow
Los campos de texto de Webflow no permiten escribir ­, porque aparecería literalmente. Copia el resultado como texto con caracteres invisibles y pégalo en el campo de encabezado, texto enriquecido o CMS: los guiones suaves se conservan de forma invisible y funcionan de inmediato en la web publicada. Para eliminarlos más adelante, pega el texto aquí y haz clic en «Eliminar caracteres invisibles».
Sobre el modo automático
El modo automático usa reglas silábicas sencillas (transiciones vocal-consonante) para sugerir puntos de corte, manteniendo al menos tres letras a cada lado. Funciona bien para titulares, pero no es un silabeador completo basado en diccionario: revisa las palabras importantes en la vista previa o define los cortes manualmente con el marcador para obtener resultados perfectos.
También se busca como: guion suave, ­, guion condicional, espacio de ancho cero, zwsp, separación silábica, cortar palabras largas móvil, silabeo css.
Herramientas que combinan con: Generador de Guion Suave
- Comillas curvas a rectas — ¿El código copiado de Slack, Notion, Word o un blog no funciona?
- Convertidor de mayúsculas y minúsculas — Pega cualquier texto y conviértelo entre 11 estilos de mayúsculas y minúsculas: desde «Title Case» para titulares hasta «camelCase» y «snake_case» para código.
- Contador de palabras — Pega o escribe tu texto para contar palabras y caracteres en tiempo real, además de calcular el tiempo de lectura y de pronunciación, la densidad de palabras clave y comprobar la longitud de los títulos SEO, las metadescripciones y las publicaciones en redes sociales.
- Codificar entidades HTML — Escapa < > & " para mostrar texto de forma segura en HTML, convierte tildes y símbolos en entidades con nombre o numéricas, o decodifica HTML con entidades a texto plano.
Preguntas frecuentes
¿Cómo escribo un guion suave?
­. En editores que no aceptan entidades (Webflow, Figma, la mayoría de campos de CMS), copia el carácter desde esta herramienta: es invisible, pero está presente. En Windows también puedes escribir Alt+0173.