GraphQL Formatter & Beautifier
This tool re-indents GraphQL documents so they are easy to read, or collapses th
This tool re-indents GraphQL documents so they are easy to read, or collapses th
How to use GraphQL Formatter & Beautifier
- Paste your GraphQL query, mutation, fragment, or schema into the input box.
- Choose Beautify with an indent size, or Minify to compact it.
- Copy the formatted result or download it as a .graphql file.
About GraphQL Formatter & Beautifier
This tool re-indents GraphQL documents so they are easy to read, or collapses them into a single compact line for shipping. Paste a query, mutation, subscription, fragment, or schema (SDL) and it tokenizes the source, then re-emits it with consistent line breaks and spacing. Beautify mode puts each field, argument, and definition where you would expect it; minify mode strips comments and unnecessary whitespace while keeping the document valid.
The formatter is a lexer plus a printer, not a full validator. It understands GraphQL's structure - selection sets, arguments, variable definitions, directives, aliases, inline fragments, list and input-object values, block strings, and # comments - and reformats them. It does not check that fields exist on a type or that a query is executable, so it will happily format a document that a server would reject. Contents inside strings and """block strings""" are preserved exactly and never re-indented, which keeps your data intact but means multi-line block-string text stays at the left margin.
Everything runs locally in your browser using plain JavaScript. Your GraphQL is never uploaded, logged, or sent anywhere - useful when a query contains internal field names or example values you would rather not paste into a remote service. You can copy the result or download it as a .graphql file.
Frequently asked questions
- What kinds of GraphQL can it format?
- Queries, mutations, subscriptions, named and anonymous operations, fragments, inline fragments, and schema definition language (SDL) such as type, input, enum, and interface blocks. It handles variables, default values, arguments, directives, aliases, list values, and input objects.
- Does it validate my query against a schema?
- No. It formats the text based on GraphQL's syntax but does not check that fields, types, or arguments are correct. It reformats structure only, so a document that formats cleanly can still be rejected by a server. If your input has a syntax error like an unterminated string, the tool shows a message instead of output.
- What is the difference between beautify and minify?
- Beautify adds line breaks and indentation (2 spaces, 4 spaces, or tabs) so the document is readable. Minify removes comments and collapses everything to the shortest valid single line, which is handy for embedding a query in code or reducing payload size.
- Is my GraphQL uploaded anywhere?
- No. All parsing and formatting happen entirely in your browser with JavaScript. Nothing is sent to a server, so it is safe to use with private or internal queries.
- Why does the text inside a block string keep its original indentation?
- String and block-string contents are treated as data and copied verbatim so the formatter never changes the meaning of your values. Only the GraphQL syntax around them is re-indented.
- Will it keep my comments?
- Beautify keeps # comments, placing trailing comments on the same line as the field and standalone comments on their own line. Minify removes all comments, since they are not needed at runtime.