Does it format queries and schemas?

Both. Query documents (operations, fragments, variables) and schema definitions (types, inputs, enums, directives) format with the same conventions.

What style does it use?

Prettier-style: field per line, arguments on their own lines when multiple, consistent indent. Matches GraphQL's canonical formatting.

Does it validate the query?

Syntax only — it parses the document but doesn't check against a schema. For schema validation use a GraphQL linter (eslint-plugin-graphql, graphql-schema-linter).

What about GraphQL SDL comments?

Preserved — descriptions (""" multi-line """) and single-line comments stay attached to their declarations.

GraphQL Formatter | DevTools Surf

DevTools Surf

Example: GraphQL Formatter

A worked example, rendered from real sample data. Sign in to run the tool on your own input.

Input

query { users(first: 10, where: { active: true }) { edges { node { id name email posts { title createdAt } } } pageInfo { hasNextPage endCursor } } }

Output

query {
  users(first: 10, where: { active: true }) {
    edges {
      node {
        id
        name
        email
        posts {
          title
          createdAt
        }
      }
    }
    pageInfo {
      hasNextPage
      endCursor
    }
  }
}

About GraphQL Formatter

GraphQL Formatter preview - Generators tool

Format and prettify GraphQL queries and schemas. Part of the DevTools Surf developer suite. Browse more tools in the Generators collection.

Use Cases

Formatting auto-generated GraphQL queries for code review
Cleaning up schema definitions for API documentation sites
Prettifying copied queries from GraphQL playground tools
Standardizing query formatting across a frontend codebase

Tips

Format nested queries to clearly show field hierarchy
Clean up minified schema definitions for documentation
Validate query structure by checking for syntax errors

Fun Facts

GraphQL was developed internally at Facebook in 2012 by Lee Byron, Dan Schafer, and Nick Schrock, and open-sourced in 2015.
Despite its name, GraphQL has no relation to graph databases; the 'Graph' refers to the application data graph it models.
The GraphQL specification is maintained by the GraphQL Foundation under the Linux Foundation, which took over governance in 2019.

FAQ

Does it format queries and schemas?: Both. Query documents (operations, fragments, variables) and schema definitions (types, inputs, enums, directives) format with the same conventions.
What style does it use?: Prettier-style: field per line, arguments on their own lines when multiple, consistent indent. Matches GraphQL's canonical formatting.
Does it validate the query?: Syntax only — it parses the document but doesn't check against a schema. For schema validation use a GraphQL linter (eslint-plugin-graphql, graphql-schema-linter).
What about GraphQL SDL comments?: Preserved — descriptions (""" multi-line """) and single-line comments stay attached to their declarations.

Related Generators Tools

UUID Generator ULID Generator Password Generator cURL to Code Cron Expression Parser SQL Formatter JSON Schema Generator TypeScript Interface Generator