Skip to content

Formatters & Code

GraphQL Formatter

Format GraphQL queries and schemas.

Runs in your browser
GraphQL formatter & validator
lines: 0chars: 0size: 0 B
GraphQL · UTF-8 · 2-space indent

Understanding GraphQL formatting

Queries, mutations, and the schema.

The formatter handles both halves of GraphQL — the queries you write and the SDL that defines the API.

Two kinds of GraphQL syntax.

A GraphQL operation is a query, mutation, or subscription — what a client sends to the server. A GraphQL schema is the SDL (Schema Definition Language) that declares types, fields, arguments, and directives. The formatter parses both: paste a query, get a clean query back; paste a schema, get a clean schema back.

Indentation and field selection.

Two-space indentation by convention. Each field gets its own line; nested selection sets indent further. Inline fragments (... on Type) and named fragments (...UserFields) stay on the same line as the field they descend from.

Variables and arguments.

GraphQL operations take variables declared with $name. The formatter keeps those declarations on the operation line if they fit, or breaks them across multiple lines if the signature is too long. Field arguments follow the same rule — short ones inline, long ones broken with one argument per line.

Comments.

GraphQL has two kinds of comment: # at the end of a line for ignored comments, and triple-quoted strings ("""…""") above a type or field for schema documentation. Both round-trip cleanly. The documentation strings are part of the schema's introspection output, so a formatted schema is also self-describing.

SDL conventions.

Types in PascalCase (User, OrderItem), fields in camelCase (firstName, createdAt), enum values in SCREAMING_SNAKE (STATUS_ACTIVE). The formatter doesn't change casing — that's a linter's job — but it keeps the surrounding whitespace consistent so the conventions read clearly.

Frequently asked questions

Quick answers.

Does it format queries or just schemas?

Both. Queries, mutations, subscriptions, fragments and schema SDL all go through the same Prettier parser.

Does it validate against my schema?

No — it's a syntactic formatter only. For schema-aware validation use a dedicated client like GraphiQL or Apollo Studio.

Does it handle multi-operation documents?

Yes — multiple queries or mutations in a single document are formatted and separated consistently.

Is my query sent anywhere?

No — everything runs in your browser.

People also search for

Related tools

More in this room.

See all in Formatters & Code