Added a reset button as suggested. Thanks for the input!
Log in to leave a comment
Hiii there,
Here’s RegexLab, a small in-browser regex playground that lets you test patterns, see matches highlighted in real time, and get simple explanations for what a regex is actually doing. You can also share a link that restores the exact state, which makes debugging and showing examples way easier. I learned (again) that most “hard” tools become much nicer once you slow down and make feedback obvious.
I hope this ship goes well, lesgoooo 🦖
Final Draft!!!
I’m wrapping up RegexLab with this update.
The tool now supports shareable links, so the text and regex pattern are synced directly to the URL. Opening the link restores the exact same state, which makes it easy to share examples or edge cases without any setup.
I also polished the UI and interactions so it feels smoother to use overall. Highlighting is clearer, the layout is more intentional, and everything runs fully in the browser without any backend.
RegexLab does what I wanted it to do, make regex easier to test, understand, and share. I’m locking this project here and moving on to the next one.
Draft 4, In this draft, I focused on usability.
I added a small regex library with commonly used patterns that can be inserted with a single click. This makes it easier to experiment without having to remember or type patterns from scratch.
Once a pattern is selected, everything else still works as before, matches are highlighted and the explanation updates automatically. It already feels much smoother to use compared to earlier drafts.
The final draft will focus on polishing the UI and making patterns shareable. Lessgooo
This is Draft 3. In this draft, I added basic explanations for common regex patterns.
Along with match highlighting, RegexLab now shows a plain-language breakdown of what different parts of a regex are doing. The explanations are rule-based and currently cover only the most commonly used tokens, which keeps things understandable and predictable.
This already makes it easier to reason about why a pattern behaves the way it does, instead of treating regex like a black box.
Next, I want to focus on usability by adding a small library of common regex patterns that can be quickly inserted and tested.
Log in to leave a comment
This is Draft 2 of RegexLab. In this draft, I focused on making regex behavior visible instead of abstract.
RegexLab now highlights all matches directly inside the text, so instead of just seeing a yes or no, you can actually see what parts of the input the pattern is matching. The text input stays editable, and a separate preview updates in real time with highlighted matches.
This already makes debugging patterns a lot easier, especially when a regex matches more than once or behaves unexpectedly.
Next, I want to move beyond visuals and start explaining regex patterns in plain language so it’s clearer why a pattern behaves the way it does.
Log in to leave a comment
Started working on RegexLab, a small browser-based regex playground.
Draft 1 is focused only on the core: typing a regex, typing some text, and getting immediate feedback on whether it matches. It also handles invalid patterns so you’re not left guessing why something isn’t working.
Nothing fancy in this draft. The goal was to get a solid base working before adding any visual layers or explanations on top of it.
Next draft will focus on highlighting matches directly inside the text so it’s clearer what the regex is actually doing.
Log in to leave a comment