GraphQL formatter
Format GraphQL schemas and queries: a hand-written lexer indents {} () [] nesting, treats commas as optional, keeps string and """block string""" content byte-for-byte and never swallows # comments — in pretty or minified mode.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Type some GraphQL above and the result shows up here.
What this tool does
- Turn a single-line GraphQL query copied from docs, GraphiQL or logs back into an indented version you can actually read and review.
- Tidy up a GraphQL schema (SDL) so every type, field and argument sits on its own line and diffs between two versions stay readable.
- Minify a query before embedding it in a URL query string, a header or an environment variable.
- Catch syntax problems early: unclosed strings, `"""` block strings and unbalanced brackets are reported instead of silently reflowed.
Example
Input
query Q($id:ID!){user(id:$id){id name posts{title}}}Output
query Q($id: ID!) {
user(id: $id) {
id
name
posts {
title
}
}
}Commas are insignificant in GraphQL, so pretty mode replaces them with line breaks; string and # comment content is never rewritten.
Frequently asked questions
Does formatting change what the query does?
No. Outside string literals and comments, whitespace and commas are only separators in GraphQL, so re-wrapping them cannot change the meaning. String literals, `"""` block strings and comment text are preserved byte for byte.
Why does minify drop my # comments?
Comments carry no meaning in GraphQL, so minify removes them by default. Enable “keep # comments” if you want them back — the output then forces a newline after each comment, which the language requires.
Why is a field name after a keyword kept on the same line?
Words like query, type, fragment, on and implements introduce a definition header (for example `fragment F on User`), so the name that follows stays on the same line. Only real field names are put on separate lines.
What does “unbalanced brackets” mean?
The counts of { }, ( ) and [ ] do not match — usually a missing closing brace after pasting a query, or two queries concatenated together. Fix the brackets near the reported position and the error goes away.
Is my input uploaded anywhere?
No. Lexing and re-indentation run entirely in your browser, the page makes no network requests, and it works with the network disconnected.
Keywords:graphqlgraphql formattergraphql beautifygraphql minifysdlquerygraphql 格式化graphql 美化graphql 压缩schema缩进词法解析