Generador de bordes de texto
Escribe unas líneas y obtenlas enmarcadas en un recuadro limpio hecho con caracteres Unicode de dibujo de recuadros o con ASCII simple. Elige simple, doble, redondeado, grueso, discontinuo, estrellas o tus propios caracteres, y ajusta la alineación, el relleno, un título y el ajuste de línea.
Última actualización:
El dibujo de recuadros solo se alinea con una fuente monoespaciada. En apps de chat pégalo con Copiar como bloque de código (añade las marcas ```); en código, úsalo dentro de un comentario.
Cómo usar Generador de bordes de texto
- Escribe o pega tu texto; cada línea se convierte en una línea dentro del recuadro.
- Elige un estilo de borde de la galería, o elige Personalizado e ingresa tus propios caracteres de esquina y de borde.
- Ajusta la alineación y el relleno y, si quieres, un título, un ancho de ajuste o un ancho mínimo.
- Revisa la vista previa en vivo, que usa una fuente monoespaciada como la mayoría de los editores de código y terminales.
- Copia el recuadro o cópialo como bloque de código, y luego pégalo en tu comentario de código, README, chat o notas.
Referencia de caracteres de dibujo de recuadros
Unicode tiene un bloque dedicado de Box Drawing (U+2500 a U+257F) diseñado para que las líneas se unan sin cortes en fuentes monoespaciadas. Estos son los caracteres que usan los estilos principales.
| Estilo | Esquinas | Horizontal | Vertical | Uniones en T | Puntos de código |
|---|---|---|---|---|---|
| Simple (fino) | ┌ ┐ └ ┘ | ─ | │ | ├ ┤ | U+250C, U+2510, U+2514, U+2518, U+2500, U+2502 |
| Doble | ╔ ╗ ╚ ╝ | ═ | ║ | ╠ ╣ | U+2554, U+2557, U+255A, U+255D, U+2550, U+2551 |
| Redondeado | ╭ ╮ ╰ ╯ | ─ | │ | ├ ┤ | U+256D a U+2570 |
| Grueso | ┏ ┓ ┗ ┛ | ━ | ┃ | ┣ ┫ | U+250F, U+2513, U+2517, U+251B, U+2501, U+2503 |
| Discontinuo | ┌ ┐ └ ┘ | ┄ | ┆ | ├ ┤ | U+2504, U+2506 |
| Doble arriba y abajo | ╒ ╕ ╘ ╛ | ═ | │ | ╞ ╡ | U+2552, U+2555, U+2558, U+255B |
| Bloques | ▛ ▜ ▙ ▟ | ▀ ▄ | ▌ ▐ | ninguno | Block Elements U+2580 a U+259F |
Cómo se mide el recuadro
El generador busca la línea más ancha, añade el relleno lateral en ambos lados y dibuja los bordes superior e inferior exactamente con ese ancho más los dos caracteres laterales. Las líneas más cortas se rellenan con espacios según la alineación que elijas; con alineación centrada, un espacio sobrante impar va a la derecha. El ancho se cuenta en columnas de terminal, no en caracteres: los emojis y los caracteres chinos, japoneses y coreanos cuentan como dos columnas, los acentos combinados y los caracteres de ancho cero cuentan como cero, y las tabulaciones se expanden a cuatro espacios. Es la misma regla que usan la mayoría de los editores de código y terminales, así que el borde derecho se mantiene recto al pegarlo.
Dónde funciona bien el texto enmarcado
- Comentarios de código y cabeceras de archivo: un título enmarcado hace que las secciones sean fáciles de ver al desplazarse por un archivo largo.
- Archivos README y documentación: pon el recuadro dentro de un bloque de código delimitado para que conserve su forma en GitHub y en visores de Markdown.
- Salida de terminal y CLI: banners y avisos en scripts, pantallas de ayuda y resúmenes de registros.
- Chats y foros: usa Copiar como bloque de código para que Discord, Slack y apps similares lo muestren con una fuente monoespaciada.
- Correos de texto simple y notas: elige un estilo ASCII cuando no estés seguro de que la fuente del lector admita caracteres de dibujo de recuadros.
Preguntas frecuentes
¿Por qué mi recuadro se ve roto después de pegarlo?
El dibujo de recuadros solo se alinea con una fuente monoespaciada, donde todos los caracteres tienen el mismo ancho. Pégalo en un editor de código, una terminal o un bloque de código (```) en apps de chat como Discord, Slack o GitHub. Con fuentes proporcionales los bordes se desplazan.
¿Qué estilo es el más seguro para usar en cualquier sitio?
Los estilos ASCII (+ - |, estrellas y almohadilla) usan solo caracteres básicos del teclado, así que se muestran correctamente en cualquier fuente monoespaciada, terminales antiguas y correos de texto simple. Los estilos Unicode de dibujo de recuadros se ven más suaves, pero necesitan una fuente que incluya esos caracteres, como casi todas las fuentes modernas.
¿Por qué los emojis se tratan como de doble ancho?
La mayoría de las terminales y editores de código dibujan los emojis y los caracteres chinos, japoneses y coreanos con dos columnas de ancho. Contarlos como dos mantiene recto el borde derecho. Si tu editor los dibuja con ancho simple, desmarca esa opción.
¿Puedo poner un título en el borde?
Sí. Escríbelo en Título en el borde superior y aparecerá dentro del borde de arriba, por ejemplo ┌─ Notas ──────┐. El recuadro se agranda si el título es más largo que el texto.
¿Cómo hago que todos mis recuadros tengan el mismo ancho?
Define un Ancho interior mínimo. Todos los recuadros tendrán al menos ese ancho, lo que ayuda cuando apilas varias notas enmarcadas o banners de comentarios en un archivo.
¿Puedo usarlo para comentarios de código?
Sí. Crea el recuadro, cópialo y añade el marcador de comentario de tu lenguaje delante de cada línea, o usa la herramienta Añadir prefijo y sufijo a las líneas para añadir // o # a todas las líneas a la vez.
¿Se prueban todas las herramientas de FreeToolCabin para comprobar su calidad y precisión?
Sí. Cada herramienta del sitio pasa pruebas automáticas en navegadores reales para comprobar que el resultado es correcto y que no hay errores. Si encuentras un fallo o tienes una sugerencia, escríbenos a [email protected] y lo revisaremos.