Web Tools tools.bryantsmith.com

Creative Workflow Helpers

Form Payload Visualizer

See exactly how form fields become a query string, URL-encoded body, FormData object, or multipart payload. Everything is computed in your browser — your data never leaves the page.

Runs in your browser v1.0.0

Form fields

key=value per line

One field per line as name=value. Blank lines and # comments are ignored, and a repeated name sends multiple values in order. Prefix a value with @ for a file, e.g. avatar=@photo.png.

Load example

Payload

application/x-www-form-urlencoded
Output format

The default request body for an HTML form submitted with method="post".

0 fields 0 bytes 
Add at least one field to see the payload.

    How it works

    Each line becomes one form field. A method="get" form appends the URL-encoded fields to the URL as a query string, while method="post" sends them as the request body. Browsers switch to multipart/form-data when a form contains files. enctype is what decides between the two, and this tool shows the exact bytes each option produces.

    Related tools

    • MySQL EXPLAIN VisualizerPaste MySQL EXPLAIN output to get a readable execution plan with plain-English warnings — entirely in your browser.
    • .env Compare & MergeCompare development, staging, and production .env key sets without exposing secret values, then build a merged template.
    • Accessible Name CalculatorPaste HTML, pick an element, and see the accessible name assistive technology computes — entirely in your browser.
    • Apache Rewrite TesterTest Apache mod_rewrite rules against a sample request path and see the rewritten URL, redirects, captures and warnings.
    • Cookie Builder & InspectorBuild a Set-Cookie header or paste one to inspect its expiry, path, domain, Secure, HttpOnly and SameSite attributes — entirely in your browser.
    • CORS Header Builder & ExplainerModel a cross-origin request and get the exact CORS response headers to send, explained in plain language.

    More Creative Workflow Helpers tools