See your regex. Debug your regex. Understand your regex.
Regex Railroad turns regular expressions into interactive railroad diagrams, plain English explanations, and a step-through NFA debugger — all in the browser, with zero server dependencies. Supports JavaScript, Python, and PCRE flavors.
- 🚂 Interactive railroad diagrams — real-time SVG rendering from regex AST
- 🔍 Step-through debugger — watch NFA execution with backtracking visualization
- 📖 Plain English explanations — every regex element described clearly
⚠️ Backtracking detection — static analysis warns about catastrophic patterns- 🎨 Dark/light mode — beautiful themes for both preferences
- 📋 Copy for any language — escape regex for JS, Python, Java, Go, Rust, C#, PHP
- 🔗 Shareable URLs — encode full state in the URL hash
- 📚 Pattern library — 22 pre-built patterns for emails, URLs, IPs, dates, and more
- 🌐 Three regex flavors — JavaScript, Python, PCRE with flavor-specific parsing
- ⚡ 100% client-side — no server, no tracking, works offline
- 🧪 4,896 unit tests — battle-tested regex engine
git clone https://github.com/ndcorder/regex-railroad.git
cd regex-railroad
pnpm install
pnpm devOpen http://localhost:5173 and start typing a regex.
- Enter a regex — type or paste a pattern into the input field
- See the diagram — the railroad diagram updates as you type
- Read the explanation — plain English breakdown appears alongside the diagram
- Debug with a test string — enter text and step through NFA execution
- Copy for your language — grab the escaped version for JS, Python, Java, Go, Rust, C#, or PHP
- Share — the URL encodes your pattern, flags, flavor, and test string
| Feature | JS | Python | PCRE |
|---|---|---|---|
| Named groups | (?<name>) |
(?P<name>) |
(?<name>), (?'name'), (?P<name>) |
| Named backreferences | \k<name> |
(?P=name) |
\k<name>, \k'name', (?P=name) |
| Possessive quantifiers | — | — | ✓ |
| Atomic groups | — | — | ✓ |
| Unicode properties | ✓ | — | ✓ |
| Inline flags | — | ✓ | ✓ |
src/lib/
├── parser/ Lexer + recursive descent parser → AST
├── diagram/ AST → layout → SVG rendering
├── engine/ NFA simulator with step recording
├── explain/ AST → plain English descriptions
├── copy/ Regex escaping for 7 target languages
├── library/ 22 pre-built regex patterns
├── sharing/ URL hash encoding/decoding
└── stores.svelte.ts Reactive state (Svelte 5 runes)
pnpm test # 4,896 unit tests (Vitest)
pnpm test:e2e # Playwright end-to-end tests
pnpm check # TypeScript type checking
pnpm lint # ESLint + Prettierpnpm build # Static site output in build/
pnpm preview # Preview production buildThe build produces a fully static site (via @sveltejs/adapter-static) that can be deployed anywhere — GitHub Pages, Netlify, Vercel, or a plain file server.
- SvelteKit 2 + Svelte 5 with runes
- Tailwind CSS 4
- TypeScript (strict mode)
- Vitest + Playwright
Contributions are welcome! See CONTRIBUTING.md for guidelines.