GraphQL Formatter

Format GraphQL queries, mutations, fragments and SDL schemas with Prettier, keeping comments. Syntax errors show line and column. Free and in-browser.

Indentation

GraphQL input

Output

Runs entirely in your browser. Your data is never uploaded.

Related Tools

View All

JSON Formatter JSON Validator XML Formatter camelCase snake_case kebab-case PascalCase CONSTANT_CASE

What is GraphQL Formatter?

The GraphQL Formatter pretty-prints GraphQL operations (queries, mutations, subscriptions, fragments) and schema definition language (SDL) with consistent indentation. Comments are kept.

How to use GraphQL Formatter

Paste a GraphQL query or schema.
Choose the Indentation.
Click Format (the output also updates while you type).
Copy or download the formatted GraphQL.

Example

Input

query { user(id: 1) { name } }

Output

query {
  user(id: 1) {
    name
  }
}

When to use GraphQL Formatter

Use it to read minified queries captured from network requests, format operations for docs, or check query syntax. It does not validate fields against your schema.

How GraphQL Formatter works

The document is formatted with Prettier's GraphQL plugin, which parses it with the reference graphql-js parser and prints each selection set on its own indented lines, arguments and variables with normalized spacing, and long argument lists wrapped. Because Prettier keeps comments (unlike graphql.print), # comments survive. Parse errors are reported with line and column.