View GraphQL schema

Visualize GraphQL types, fields, arguments, and relationships from SDL.

freeworks offlinenothing uploaded
ToolGraphQL Schema Viewer
Input
Output
—
Put this on your own site

The frame below runs the same code as this page, in the reader's own browser. Nothing is sent to us, and nothing is sent to you.

Pick a dark background and the text and panels follow it, so the frame stays readable on a dark page.

Preview

How it works

SDL definitions become object, interface, union, enum, scalar, input, and directive nodes; type wrappers and fields become graph annotations. The viewer renders checked-in schema text and does not execute resolvers.

  • Schema-defined relationships are shown explicitly.
  • Descriptions and deprecations remain attached for review.

Worked example

Format User and Post Types
Display formatted GraphQL type definitions with proper indentation
Input
											type User {
  id: ID!
  name: String!
  email: String
}

type Post {
  id: ID!
  title: String!
  author: User!
}
Output
												type User {
  id: ID!
  name: String!
  email: String
}

type Post {
  id: ID!
  title: String!
  author: User!
}

When to use this

API contract reviews, frontend planning, and documentation visualize GraphQL SDL.

Edge cases

  • Non-null and list wrappers have different meanings.
  • Interfaces and unions need possible-type edges.
  • Deprecated fields remain valid and visible.

References