# cjex/regulex

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/cjex-regulex).**

5,836 stars · 754 forks · TypeScript · MIT

## Links

- GitHub: https://github.com/CJex/regulex
- Homepage: https://jex.im/regulex/
- awesome-repositories: https://awesome-repositories.com/repository/cjex-regulex.md

## Topics

`diagram` `javascript` `regex` `regexp` `regular-expression` `regulex` `typescript`

## Description

Regulex is a tool that parses regular expressions into interactive syntax diagrams, rendering them directly on an HTML canvas. It converts a regex string into an abstract syntax tree and visualizes the structure as a navigable diagram, making the internal logic of a regular expression visually accessible.

Beyond basic visualization, Regulex provides syntax validation that detects and reports precise errors, including invalid back references and octal escapes. It also offers a state-machine visualization mode that maps regex AST nodes to NFA-like states and transitions, rendered as a directed graph to illustrate execution flow. The tool includes an embeddable widget architecture, allowing the diagram component to be inserted into external web pages via a simple script tag, and supports exporting diagrams as downloadable image files for documentation or sharing.

## Tags

### Programming Languages & Runtimes

- [Regex Syntax Diagram Generators](https://awesome-repositories.com/f/programming-languages-runtimes/regular-expression-converters/regex-syntax-diagram-generators.md) — Converts regular expressions into interactive syntax diagrams to visualize structure and execution flow.
- [Regex AST Parsers](https://awesome-repositories.com/f/programming-languages-runtimes/abstract-syntax-tree-parsing/parsed-ast-caching/regex-ast-parsers.md) — Parses regular expression strings into abstract syntax trees for programmatic inspection and transformation. ([source](https://cdn.jsdelivr.net/gh/cjex/regulex@master/README.md))

### Data & Databases

- [Regex](https://awesome-repositories.com/f/data-databases/json-parsers/ast-parsers/regex.md) — Parses regular expression strings into abstract syntax trees for programmatic inspection and transformation.

### Development Tools & Productivity

- [Visualizers](https://awesome-repositories.com/f/development-tools-productivity/regular-expressions/visualizers.md) — Renders regular expression patterns into visual diagrams to illustrate matching logic.
- [Regex Pattern Syntax Validations](https://awesome-repositories.com/f/development-tools-productivity/syntax-validation/regex-pattern-syntax-validations.md) — Validates the syntactic correctness of regular expression patterns and reports precise errors. ([source](https://cdn.jsdelivr.net/gh/cjex/regulex@master/README.md))
- [State Machine Visualizations](https://awesome-repositories.com/f/development-tools-productivity/state-machine-visualizations.md) — Maps regex AST nodes to NFA-like states and transitions, rendering them as a directed graph.
- [Regex NFA Visualizers](https://awesome-repositories.com/f/development-tools-productivity/state-machine-visualizations/regex-nfa-visualizers.md) — Maps regex AST nodes to NFA-like states and transitions, rendering them as a directed graph.
- [Regex State Machine Visualizers](https://awesome-repositories.com/f/development-tools-productivity/state-machine-visualizations/regex-state-machine-visualizers.md) — Maps regex AST nodes to NFA-like states and transitions, rendering them as a directed graph.

### Graphics & Multimedia

- [Diagram Canvas Renderers](https://awesome-repositories.com/f/graphics-multimedia/canvas-rendering/diagram-canvas-renderers.md) — Draws interactive syntax diagrams by computing node positions and rendering paths onto an HTML canvas.
- [Regex Diagram Canvas Renderers](https://awesome-repositories.com/f/graphics-multimedia/canvas-rendering/regex-diagram-canvas-renderers.md) — Draws regex syntax diagrams directly on an HTML canvas element with interactive node navigation.

### Software Engineering & Architecture

- [Regex Visualizers](https://awesome-repositories.com/f/software-engineering-architecture/regex-visualizers.md) — Generates visual diagrams of regular expression patterns to aid understanding of their structure and flow.
- [Interactive Syntax Diagram Generators](https://awesome-repositories.com/f/software-engineering-architecture/regex-visualizers/interactive-syntax-diagram-generators.md) — Parses regular expressions into interactive syntax diagrams rendered on an HTML canvas for understanding regex structure.
- [Syntax Diagram Generators](https://awesome-repositories.com/f/software-engineering-architecture/software-architecture/diagramming-standards/text-to-diagram-generators/syntax-diagram-generators.md) — Generates interactive syntax diagrams from regular expression patterns to visualize their structure.
- [Interactive Regex Syntax Diagrams](https://awesome-repositories.com/f/software-engineering-architecture/software-architecture/diagramming-standards/text-to-diagram-generators/syntax-diagram-generators/interactive-regex-syntax-diagrams.md) — Provides interactive, navigable syntax diagrams that visualize regex structure and execution flow. ([source](https://jex.im/regulex/))

### User Interface & Experience

- [Diagram Canvas Renderers](https://awesome-repositories.com/f/user-interface-experience/coordinate-based-positioning/canvas-rendering/diagram-canvas-renderers.md) — Draws interactive syntax diagrams by computing node positions and rendering paths onto an HTML canvas.
- [Regex Diagram Embedders](https://awesome-repositories.com/f/user-interface-experience/interactive-diagram-embedding/regex-diagram-embedders.md) — Provides an embeddable version of a regex diagram that can be inserted into external websites.

### Part of an Awesome List

- [Regex Diagram Widgets](https://awesome-repositories.com/f/awesome-lists/devtools/react-components/diagram-embedding-components/regex-diagram-widgets.md) — Ships a self-contained diagram component that can be inserted into external web pages via a simple script tag. ([source](https://jex.im/regulex/))

### Content Management & Publishing

- [Regex Diagram Image Exports](https://awesome-repositories.com/f/content-management-publishing/content-formats-exporting/diagram-exporting/regex-diagram-image-exports.md) — Ships a feature to export regex syntax diagrams as downloadable image files for documentation. ([source](https://jex.im/regulex/))

### Web Development

- [Regex Diagram Widgets](https://awesome-repositories.com/f/web-development/web-based-terminal-emulators/embeddable-terminal-widgets/regex-diagram-widgets.md) — Ships a self-contained script-tag embeddable component for inserting regex diagrams into external web pages.