GraphQL to TypeScript Converter

How to use

1. 1Paste your GraphQL schema (SDL) into the input, or click Load sample schema to see a worked example with objects, an interface, enums, a union, and a custom scalar.
2. 2Read the TypeScript output on the right, which updates live as you type, along with a count of the types generated and any notice about referenced types that are not defined.
3. 3Choose whether objects render as interface or type, whether GraphQL enums become a string union or a TypeScript enum, and set the type used for custom scalars.
4. 4Toggle nullable fields, readonly properties, export keywords, and whether fields with arguments render as functions, then pick a two or four space indent.
5. 5Click Copy types to copy the TypeScript declarations, then paste them into your project.

About this tool

GraphQL to TypeScript Converter takes a GraphQL schema written in SDL (the Schema Definition Language you see in .graphql files and in introspection output) and turns it into ready-to-use TypeScript declarations, which is the step you keep doing by hand when a frontend has to match a GraphQL API. It parses the schema in your browser with a self-contained tokenizer and recursive-descent parser rather than a regular expression, so it understands the real grammar: object types, interface types, input types, enums, unions, and custom scalars, including descriptions (both quoted and triple-quoted block strings), the implements clause, directives like @deprecated, and default values on arguments and input fields, all of which it reads and skips so they do not break the output. Each GraphQL object, interface, and input type becomes a TypeScript interface or a type alias, your choice, and the field types are translated faithfully. The five built-in scalars map the way GraphQL defines them, with Int and Float becoming number, String and ID becoming string, and Boolean becoming boolean, while every custom scalar such as DateTime, JSON, or UUID maps to a TypeScript type you set once in the options. Wrapper types are handled properly, which is where naive converters fall down: a non-null String! becomes string, a nullable String becomes string or null, a list [String!]! becomes string[], and a nullable list of nullable items [String] becomes an array of string-or-null that can itself be null, with the nullability behaviour controlled by a single toggle so you can match either a strict client or a loose one. GraphQL enums can render two ways, as a structural string union like a value of ADMIN, EDITOR, or VIEWER, which stays light and tree-shakeable, or as a real TypeScript enum with string values when you want named members. Union types become a TypeScript union of their member type names, and custom scalar definitions become their own aliases so the names resolve. There are options to mark fields readonly for immutable result shapes, to prepend export so each declaration is importable, to render fields that take arguments as resolver-style functions instead of plain properties, and to indent with two or four spaces. When the schema references a type that is not defined in the text you pasted, the name is kept as-is and a notice lists what still needs wiring, rather than silently dropping it. Common uses include matching a frontend query layer to a backend schema, scaffolding types before you reach for a full code generator, sketching resolver signatures, reviewing what an API exposes, and learning how GraphQL nullability and list wrappers map onto TypeScript. Everything runs locally, so the schema you paste, which often describes an internal API, never leaves your device.

Free to use. Works in your browser. No signup, no login.