🔒 Runs in your browser — nothing is uploaded✓ Free, no signup
GraphQL Formatter
Paste a GraphQL query, mutation or schema to format it consistently with Prettier — one field per line, clean indentation and readable arguments.
0 characters
Formatted GraphQL
When should you use the GraphQL Formatter?
- Reading a minified query copied from network logs
- Tidying queries before committing them
- Formatting a GraphQL schema (SDL) file
How to use the GraphQL Formatter
- 1
Paste GraphQL
Paste queries, mutations, fragments or schema definitions.
- 2
Set indentation
Choose 2 or 4 spaces or tabs and a line width.
- 3
Check errors
Syntax errors show the line and column.
- 4
Copy
Copy the formatted GraphQL.
Examples
One-line query
Before
query{user(id:1){name,friends(first:2){edges{node{id}}}}}After
query {
user(id: 1) {
name
friends(first: 2) {
edges {
node {
id
}
}
}
}
}Common errors and how to fix them
Syntax Error: Expected Name, found <EOF>- The query is incomplete — usually a missing closing brace } or parenthesis ).
Variables are rejected- Variable definitions need a $ and a type, like query GetUser($id: ID!).
More from Code Formatters & Minifiers
Free tools that run in your browser — no signup, nothing uploaded.
SQL Formatter & Beautifier
Format SQL queries for MySQL, PostgreSQL, SQL Server, SQLite and more.
CSS Minifier & Compressor
Optimize CSS by removing whitespace and comments to accelerate page load time.
JS Minifier & Compressor
Compress JavaScript to improve website speed and performance.
XML Formatter & Validator
Format, validate and minify XML, with errors shown by line and column.
HTML Formatter & Beautifier
Beautify or minify HTML with clean, consistent indentation.
Markdown Editor & Preview
Write Markdown with a live preview and copy the HTML.
HTML to JSX Converter
Convert HTML to valid React JSX — className, style objects and more.
SVG to React Component
Turn SVG markup into a React component with camelCase attributes.
HTML to Markdown Converter
Convert HTML to clean Markdown, including tables and code blocks.
GraphQL Formatter FAQ
Queries, mutations, subscriptions, fragments and schema definitions (SDL), including directives and descriptions.
Prettier, the most widely used code formatter — so the output matches what your editor or CI would produce.
No. It checks GraphQL syntax only, not whether fields exist in your API's schema.
Yes, # comments are preserved.
Use the JSON Formatter for the variables object.
No. Everything runs in your browser, so your query never leaves your device.