Skip to main content

Regex

Visualizes a regular expression as a "railroad diagram" that shows which parts the expression is made of.

Syntax​

```regex
^[a-z0-9_]+@[a-z0-9]+\.[a-z]{2,}$
```

The content of the code block is a regex pattern directly; no additional wrapper is needed.

What it's for​

Understanding what a complex regex does can be hard; this diagram breaks the pattern into its parts (character classes, repetition counts, groups) and shows them with visual arrows. Useful when learning regex or explaining one to someone else.

Source​

This is the standard regex syntax visualized by the @regexper/render library; for reference on regex itself, any general regex resource (e.g. MDN's "Regular expressions" guide) can be used.

Tsunagi-specific note​

If you write an invalid regex pattern, the diagram isn't rendered; the code is shown as plain text instead.