Visualizador de Regex
Visualiza patrones regex como Diagramas de Ferrocarril.
Resaltado de coincidencias en tiempo real sobre el texto de prueba.
🔒La regex y las cadenas de prueba nunca se envían al servidor. ※ El diagrama usa Regulex (CDN).
Acerca de
Una herramienta para desarrolladores que renderiza expresiones regulares como Diagramas de Ferrocarril (diagramas de sintaxis) y muestra resultados de coincidencias en vivo. La función principal es visualizar la estructura regex: una característica completamente diferente del verificador de regex básico.
Cómo usar
Ingresa una regex
Escribe un patrón y configura las banderas. Usa los botones de ejemplo para comenzar.
Lee el diagrama
El Diagrama de Ferrocarril muestra la estructura de la regex como un flujo de caminos.
Prueba y exporta
Ingresa una cadena de prueba para ver coincidencias y exporta el diagrama SVG.
Glosario
- Expresión regular (Regex)
- Lenguaje formal para describir patrones de texto. En JavaScript se escribe como /patrón/banderas.
- Diagrama de Ferrocarril
- Representación visual de sintaxis/gramática. Muestra ramificación, repetición y secuencia como un camino dirigido.
- Grupo de captura
- Paréntesis () que capturan texto coincidente para reutilizarlo via $1, $2, etc.
- Cuantificador
- Especifica la repetición: * (0+), + (1+), ? (0 o 1), {n,m} (n a m veces).
- Clase de caracteres
- [ ] coincide con cualquier carácter listado. [a-z] = minúscula, [^0-9] = no dígito.
- Lookahead / Lookbehind
- (?=...) y (?<=...) afirman condiciones delante/detrás de la coincidencia sin consumir caracteres.
- Banderas (g/i/m/s/u)
- g=global, i=ignorar mayúsculas, m=multilínea, s=dotAll, u=modo Unicode.
Preguntas frecuentes
- P.¿En qué se diferencia del comprobador de regex básico?
- El comprobador básico solo muestra coincidencias. Esta herramienta genera el Diagrama de Ferrocarril para visualizar la estructura.
- P.¿Qué sintaxis regex es compatible?
- Sintaxis regex de JavaScript ES2024, incluyendo lookahead, lookbehind y grupos de captura con nombre.
- P.¿Mis datos se envían a un servidor?
- No. Todo el procesamiento es local en tu navegador.
- P.¿Requiere internet?
- La librería del Diagrama de Ferrocarril se carga desde CDN. La función de coincidencias funciona sin conexión.
Casos de uso
Aprender regex
Entiende patrones complejos visualmente viendo la estructura como diagrama.
Depurar patrones
Verifica que un patrón está estructurado como se desea antes de usarlo en producción.
Documentación de equipo
Comparte diagramas SVG en pull requests o documentación técnica.
Diagramas en especificaciones
Inserta diagramas SVG en documentos de especificación para mayor claridad.