How to use it
- Type or paste a pattern, such as
^\d{3}-\d{4}$, or a whole literal like/colou?r/gi. - Enter flags in the Flags box if you did not paste a literal.
- Read the tree: each row shows a part of the pattern on the left and what it does on the right. Indented rows belong to the group, class or quantifier above them.
How it works
The tool parses the pattern with the JavaScript grammar: alternatives split by |, then terms with their quantifiers, then groups, classes and escapes inside them. A run of plain characters is shown as one piece of text, unless a quantifier follows: in abc+ only the c repeats, so the tree shows the text “ab”, then “one or more times” for c.
Without the u or v flag, browsers accept a few legacy forms (a lone { or ], an unknown escape like \q meaning q), and so does the explainer. After parsing, the pattern is also compiled with new RegExp, so a pattern that JavaScript would reject is never explained as if it worked.
Worked example
^(?<year>\d{4})-(0[1-9]|1[0-2])$ reads as:
^the start of the text;(?<year>…)capturing group #1 named “year”: exactly 4 times, as many as possible, a digit from 0 to 9;-the character “-”;(…)capturing group #2: one of 2 alternatives — the character “0” then a character from “1” to “9”, or the character “1” then a character from “0” to “2”;$the end of the text.
So it accepts 2026-07 and 2026-12, but not 2026-13.
Tips
- Add the m flag if ^ and $ should work on every line of a multi-line text.
- A dot does not match line breaks unless you add the s flag.
- Test the pattern on real text with the regex tester once the explanation matches what you meant.