Real-time MatchingCapture GroupsBuilt-in Cheat Sheet

How It Works

1

Enter a Pattern

Type your regex pattern and select flags (global, case-insensitive, multiline, dotall).

2

Add Test Text

Enter the text you want to match against. Matches are highlighted in real-time.

3

Review Matches

See all matches with their positions, values, and captured groups listed below.

Frequently Asked Questions

What is a regular expression (regex)?
A regular expression (regex) is a sequence of characters that defines a search pattern. Regex is used for string matching, validation, search and replace, and text parsing. It is supported in virtually every programming language and many text editors.
What are some common regex patterns?
Common regex patterns include: email validation (^[\w.-]+@[\w.-]+\.\w{2,}$), phone numbers (\d{3}-\d{3}-\d{4}), URLs (https?://[\w.-]+), IP addresses (\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}), and dates (\d{4}-\d{2}-\d{2}).
What do regex flags do?
Regex flags modify how the pattern is applied: g (global) finds all matches instead of stopping at the first, i (case-insensitive) ignores letter case, m (multiline) makes ^ and $ match line boundaries instead of string boundaries, and s (dotall) makes the dot (.) match newline characters.
What are capture groups in regex?
Capture groups are created by wrapping part of a regex pattern in parentheses (). They allow you to extract specific parts of a match. For example, (\d{4})-(\d{2})-(\d{2}) applied to "2024-01-15" captures three groups: "2024", "01", and "15". Non-capturing groups (?:...) match without capturing.
What are lookahead and lookbehind assertions?
Lookahead (?=...) and lookbehind (?<=...) are zero-width assertions that match a position without consuming characters. Positive lookahead (?=abc) matches if followed by abc. Negative lookahead (?!abc) matches if NOT followed by abc. Lookbehind works similarly but checks what comes before the current position.
Share:

About Regex Tester

What this tool does

Developer and design tools include CSS generators (gradients, shadows, glassmorphism), code playgrounds, color pickers, responsive previews, and reference charts for HTML tags, HTTP methods, and keyboard shortcuts.

Why use this tool

Front-end development involves constant context switching between code and visual output. Having generators and references in a single browser tab speeds up prototyping and reduces the need to search through documentation sites.

How it works

Each tool provides an interactive UI: you tweak parameters (colors, radii, durations), and the tool generates the corresponding CSS, HTML, or SVG code in real time. Copy the snippet directly into your project.

Pro tip

Use the CSS variable output option when available. It makes your generated code theme-friendly and easier to maintain across a design system.

Deep Dive: Related Research

The Complete Guide to Regular Expressions: Every Syntax, Pattern & Engine Explained (2026)

28,000 words · 60 min read

The Complete JavaScript Reference Guide 2026: Every Feature, Method & API Explained

30,000 words · 65 min read

The Complete Python Reference Guide 2026: Data Types, OOP, Asyncio, Stdlib & Package Management

30,000 words · 65 min read

Explore More

Love this tool? Explore 12467+ more

Free online tools for images, PDFs, text, code, and more. All running in your browser.

Explore All Tools