Regex Debugger
Step through regex matching visually. See how the engine processes your pattern character by character.
About This Tool
The Regex Debugger goes beyond simple match highlighting. While a standard regex tester shows you what matched, this tool shows you how the matching engine arrives at each result. It breaks your pattern down into individual tokens — character classes, quantifiers, groups, anchors, escape sequences, and more — and lets you step through the matching process one token at a time.
Understanding regex internals is critical when you need to debug patterns that produce unexpected matches, miss edge cases, or suffer from catastrophic backtracking. By watching the engine attempt each token against each position in your test string, you can pinpoint exactly where a pattern succeeds or fails and why.
Each token in your pattern is color-coded by type: literals,
character classes ([a-z]), quantifiers (
*, +, {{n,m}}),
groups and lookarounds, anchors (^, $,
\b), alternation (|), and escape
sequences (\d, \w, \s).
The step-through debugger highlights the current token and the
current position in the test string, showing a status message at
every step so you can follow the engine's logic.
The tool also provides a full match visualization with numbered
matches and capture group details, a human-readable explanation of
every token in your pattern, and the ability to copy all match
data as JSON. All processing runs entirely in your browser using
the native JavaScript RegExp engine — no data
is ever sent to a server.
How to Use
- Enter a regular expression pattern in the pattern input field, or click one of the sample pattern buttons (Email, URL, Date) to load an example.
- Toggle flags by clicking the flag badges (
g,i,m,s,u). The global flag (g) is enabled by default. - Type or paste your test string. The tool immediately tokenizes your pattern and shows all matches with highlights.
- Review the Pattern Tokens section to see each part of your regex parsed and color-coded by type.
- Use the Step-through Debugger controls to walk through the matching process. Click Step to advance one token at a time, or Play to auto-step at an adjustable speed.
- Watch the status message and highlighted cursor position in the test string to understand what the engine is doing at each step.
- Check the Match Details panel for the full text, index, and capture groups of each match. Click Copy Matches to export all match data as JSON.
FAQ
How is this different from the Regex Tester?
The Regex Tester shows match results -- highlighted matches, capture groups, and replacement previews. The Regex Debugger focuses on the matching process: it parses your pattern into tokens, lets you step through matching one token at a time, and shows exactly where in the test string the engine is looking at each step. Use the Tester for quick match/replace tasks, and the Debugger when you need to understand why a pattern behaves the way it does.
What regex engine does this use?
This tool uses your browser's built-in JavaScript RegExp engine. The matching results will be identical to what you get in Node.js or any modern browser. Note that other engines (PCRE, Python re, .NET) may have slightly different behavior for advanced features.
What do the token colors mean?
Each token type has a distinct color. Literals are gray, character classes ([...]) are purple, quantifiers (*, +, ?, {n,m}) are amber, groups are blue, anchors are red, alternation (|) is orange, escape sequences are green, and lookarounds are pink. Hover over any token badge to see its description.
Does the step-through show actual backtracking?
The debugger provides a simplified simulation of the matching process. It steps through each token in your pattern and shows the approximate position in the test string being examined. While it does not replicate every internal backtracking decision of the engine, it gives you a clear mental model of how the pattern progresses through the input and indicates when backtracking occurs on failed match attempts.
Can this tool handle complex patterns?
Yes. The tokenizer handles character classes, nested groups, named capture groups, lookaheads, lookbehinds, non-capturing groups, backreferences, and all standard quantifiers. If your pattern is valid JavaScript regex, it will be correctly tokenized and debugged.
Is my data safe?
Absolutely. All regex parsing, tokenization, and matching runs entirely in your browser using client-side JavaScript. No patterns or test strings are ever sent to any server. Your data stays on your machine.
What keyboard shortcuts are available?
Press Space while the debugger area is focused to advance one step. Press Ctrl+Enter from anywhere to run the full match and jump to the final result. You can also use the Play/Pause button for automatic stepping with an adjustable speed slider.
Related Tools
Regex Tester
Test regular expressions with real-time match highlighting and capture groups.
String Escape/Unescape
Escape and unescape strings for JSON, JavaScript, HTML, URL, SQL, and CSV formats.
Diff Viewer
Compare two texts side by side with line-by-line and character-level diff highlighting.
Text Case Converter
Convert text between camelCase, PascalCase, snake_case, kebab-case, and other naming conventions.