GraphQL Formatter
Processed Client SidePaste a minified or messy GraphQL query, mutation, or schema and get clean, consistently indented output. Bracket balance is validated as you type.
Bookmark this tool now — skip the search next time you need it.
About GraphQL Formatter
This tool runs entirely in your browser. Whatever you paste is processed on your own device and is never uploaded, logged, or sent to any server.
Paste a minified or badly indented GraphQL query, mutation, or schema definition and get it back cleanly formatted with consistent indentation. GraphQL nests deeply by nature, so a query that has been collapsed onto one line — which is exactly what happens when you pull it out of a network request or a log — is close to unreadable. The formatter re-indents the selection set so the shape of the query becomes visible, and it validates bracket balance as you type, which catches the single most common GraphQL syntax mistake immediately rather than at the server. Strings, block strings, and comments are recognised as their own tokens, so a brace or a hash inside quoted text cannot confuse either the formatting or the balance check.
Key features
- Formats queries, mutations, subscriptions, and schema definition language
- Consistent indentation of nested selection sets, so the shape of the query is visible
- Live bracket-balance validation with a clear syntax error state
- Preserves variable definitions, default values, arguments, and directives such as @include and @skip
- Handles fragments and inline fragments
- String literals, triple-quoted block strings, and # comments recognised as tokens, so braces inside them are never mistaken for structure
- Commas normalised away, since GraphQL treats them as whitespace and they only add noise to a formatted document
- Syntax-highlighted panes for both input and output
- Live formatting as you type — no button to press
- One-click copy of the formatted result
- Runs entirely in your browser — internal schemas and queries are never uploaded
How to use it
- Paste your GraphQL query, mutation, or schema into the input pane.
- Read the formatted result, which updates as you type.
- If the syntax error badge appears, look for an unclosed brace in the selection set.
- Copy the formatted output.
Tips & common mistakes
- Unbalanced braces are the overwhelming majority of GraphQL syntax errors, because every selection set nests another. The live validation here catches them before you send the query.
- Pull the exact query your client actually sent from the network panel — request payloads are minified, and what the client sends often differs from the source after fragment interpolation.
- Formatting is not schema validation. A perfectly formatted query can still fail because a field does not exist or an argument type is wrong — only the server or a schema-aware tool can tell you that.
- Field names are case-sensitive in GraphQL, and a wrong case reads as a missing field rather than a typo in the error message.
- Requesting a deeply nested selection set is where GraphQL performance problems come from. Seeing the query formatted makes an accidental N+1 shape obvious.
- Schema definition language formats here too, which makes this useful for tidying a .graphql schema file before committing it.
- Commas are optional in GraphQL — the spec treats them as whitespace — so seeing them removed from your arguments is expected and changes nothing about what the query means.
- Block strings written with triple quotes are how descriptions are attached to schema types. They survive formatting intact, so an SDL file keeps its documentation when you tidy it here.