Interactive Demos

HTTP Transaction (Request + Response)

A complete HTTP exchange showing both request and response in wire format.

Request Only

Display just the request portion with method coloring and header highlighting.

Response Only

Display just the response with status code coloring and JSON body highlighting.

JSON Body Highlighting

JSON responses are automatically parsed and syntax highlighted.

HTML Response

HTML content with tag, attribute, and value highlighting.

CSS Response

CSS with selector, property, and value highlighting.

JavaScript Response

JavaScript with keyword, string, and comment highlighting.

Error Response (404)

Error status codes are highlighted in red/orange colors.

Waterfall View

Multiple requests visualized with timing. Toggle between List, Duration, and Waterfall views.

Live HTTP Capture

Capture real HTTP requests made by the page. Click the buttons to make test API calls.

The viewer below captures all fetch() and XMLHttpRequest calls. Try the buttons to see requests appear in real-time!

Test API Calls

Request Builder (Explorer)

Build and send custom HTTP requests interactively. The explorer is built into http-waterfall.

Highlighting Sections

Use the highlight attribute to emphasize specific parts of the request/response.

Bordered Sections

Use the box attribute to add labeled borders around sections.