Setup & Installation
openclaw skills install @pipedream941/regex-visualizer
Or with the ClawHub CLI, for registry-managed skill folders outside a full OpenClaw workspace:
npx clawhub install regex-visualizer
What This Skill Does
Exports railroad diagram visualizations for JavaScript regular expressions as SVG and PNG files. Uses the Regulex-Plus web UI rendering engine via headless browser, so output matches the web UI exactly rather than a re-implemented diagram. Supports flags i, m, and g.
Output matches the Regulex-Plus web UI exactly because it reuses the same export logic, avoiding visual discrepancies that come from custom re-implementations.
When to use it
- Generating regex diagrams for technical documentation
- Sharing visual regex breakdowns with teammates
- Debugging complex regular expressions visually
- Embedding regex diagrams in README or wiki pages
- Archiving regex patterns as images for presentations
Example Workflow
Here's how your AI assistant might use this skill in practice.
INPUT
User asks: Generate a railroad diagram for the regex ^(a|b)*?$ with flag i
AGENT
- 1Runs render.mjs with --re '^(a|b)*?$' and --flags 'i' and an output path
- 2Loads regulex.html in a headless browser via puppeteer-core
- 3Triggers the built-in cmd=export mode to capture the canvas and SVG element
- 4Writes the SVG and PNG files to the specified output path
OUTPUT
SVG and PNG files of the railroad diagram matching the Regulex-Plus web UI export