Skip to content
SPECIFICTION
Get listed

GraphiQL

graphiql.dev

Free plan WebSelf-hosted
Visit graphiql.dev
Spec score 8.4 #3 of 32 in GraphQL Tools

What it is

GraphiQL is a free, interactive, in-browser IDE for GraphQL. Its editor supports the latest GraphQL specification, with syntax highlighting, type-aware suggestions, query and variable completion, and real-time error highlighting. A searchable documentation explorer can display Markdown, and the built-in query history and documentation explorer are available as plugins. GraphiQL can preserve state in browser localStorage and provides a plugin API for extending its interface. It is also a React package for embedding the IDE in an application; a component needs a fetcher function that sends requests to a GraphQL API. The toolkit fetcher supports HTTP, multipart incremental delivery, and subscriptions through graphql-ws or the legacy WebSocket protocol. Developers can customize the interface with React props and children, while CSS variables are the supported way to change its appearance. GraphiQL is open source under the MIT license. Its project offers a progressive web app demo and examples for CDN, Webpack, Create React App, and Parcel.

Spec sheet

Purpose
GraphiQL is an interactive, in-browser IDE for GraphQL.Read 7 Oct 2026 · github.com
Available platforms
webRead 20 Sep 2026 · graphiql.dev
Deployment
The project provides an installable progressive web app demo and examples for CDN, Webpack, Create React App, and Parcel.Read 7 Oct 2026 · github.com
Free plan
YesRead 20 Sep 2026 · graphiql.dev
Integrations
The project provides examples for CDN ESM, Webpack, Create React App, and Parcel, and its repository describes GraphQL language tooling for CodeMirror, Monaco, and Visual Studio Code.Read 7 Oct 2026 · github.com
Security
The project warns that GraphiQL versions below 1.4.7 are vulnerable to an XSS attack when connected to an untrusted GraphQL server.Read 7 Oct 2026 · github.com
Support
The project directs users to GitHub for issues and discussions and to the GraphQL Discord server for community discussion.Read 7 Oct 2026 · github.com
License
The GraphiQL repository describes the code as open source under the MIT license.Read 7 Oct 2026 · github.com
API connection
A GraphiQL component requires a fetcher function that performs requests to a GraphQL API and can support promises, observables, or async iterables.Read 7 Oct 2026 · github.com
Browser support
The repository says its browser bundle targets modern browsers and does not support Internet Explorer or older evergreen browser versions.Read 7 Oct 2026 · github.com
Customization
The UI can be customized with React props and children, and CSS variables are the officially supported way to customize its appearance.Read 7 Oct 2026 · github.com
Customization limit
The README says GraphiQL class names are not stable and may change between minor or patch releases.Read 7 Oct 2026 · github.com
Documentation
Its documentation explorer supports search and Markdown.Read 7 Oct 2026 · github.com
Documentation explorer
Its documentation explorer supports search and Markdown.Read 7 Oct 2026 · github.com
GraphQL support
YesRead 20 Sep 2026 · graphiql.dev
Installation
The package installation instructions list React, React DOM, and GraphQL as peer dependencies.Read 7 Oct 2026 · github.com
Integration
GraphiQL is a React package that requires a fetcher function to send requests to a GraphQL API.Read 7 Oct 2026 · github.com
Language support
It supports the latest GraphQL specification with syntax highlighting, type-ahead suggestions, error reporting, and automatic query and variable completion.Read 7 Oct 2026 · github.com
Plugins
GraphiQL has a plugin API, with built-in documentation explorer and query history plugins.Read 7 Oct 2026 · github.com
Query editing
It supports GraphQL syntax highlighting, type-aware suggestions, query and variable completion, and real-time error highlighting.Read 7 Oct 2026 · github.com
Saved state
GraphiQL persists state using localStorage.Read 7 Oct 2026 · github.com
Transport support
The toolkit fetcher supports HTTP, multipart incremental delivery, and subscriptions through graphql-ws or the legacy WebSocket protocol.Read 7 Oct 2026 · github.com
WebSocket support
YesRead 20 Sep 2026 · graphiql.dev

Plans and prices

GraphiQL Free MIT-licensed open-source project · distributed as a package for use in React applications Read 7 Oct 2026 · github.com

Every GraphiQL plan and price →

Strong points and limits

Strong points

  • Supports the latest GraphQL specification.
  • Includes query and variable completion and error highlighting.
  • Documentation explorer supports search and Markdown.
  • Plugin API and built-in query history plugin.
  • Free, open source, and MIT-licensed.

Limits

  • A React integration requires a fetcher function.
  • Class names may change between minor or patch releases.
  • Browser bundle does not support Internet Explorer or older evergreen browsers.
  • A 2021 advisory reports XSS in versions 0.5.0 through 1.4.6.

Who it suits

GraphiQL suits developers who need an in-browser GraphQL IDE or want to embed one in a React application. Integrations require a fetcher function to connect to a GraphQL API.

Verdict

GraphiQL offers a free GraphQL editor for browser use and React embedding, with query assistance and documentation tools. Check the stated browser support and the affected-version advisory when selecting a version.

Where Specifiction places it

Alternatives to GraphiQLAll alternatives →