Output will appear herequicktype-core. Zero HTTP requests during generation — verify in DevTools' Network tab.About JSON to TypeScript
A JSON-to-TypeScript generator infers TypeScript type definitions from sample JSON data — useful for typing API responses, configuration files, and external data sources. Uses quicktype-core (the open-source library that powers app.quicktype.io), which handles nested objects, arrays of mixed types (tagged unions), null/undefined detection, and date/UUID inference. Output: clean `interface` declarations or `type` aliases ready to paste into a TypeScript codebase.
Why use a JSON to TypeScript?
Manually writing TypeScript interfaces for complex API responses is tedious and error-prone — easy to miss optional fields, mistype property names, or use `any` for nested objects. Generating from a sample response is faster, more accurate, and self-updating (re-generate when the API changes). Useful for: typing third-party REST/GraphQL responses, OpenAPI fragments, MongoDB documents, Firebase Firestore data, configuration JSON files.
Who is it for?
TypeScript developers integrating with REST/GraphQL APIs that lack official type definitions, full-stack developers typing config files (next.config.js, tailwind.config.js, custom JSON configs), frontend devs working with backend payloads, and anyone migrating a JavaScript codebase to TypeScript who needs to type pre-existing JSON data structures.
How to use the tool
Paste a JSON sample into the input area (a full response, an object, or an array)
Optionally name the top-level type (default: 'Root')
Choose output style: interface (named, extendable) or type alias
View the generated TypeScript with inferred types for every property
Copy the result into your codebase — refine optional/nullable handling as needed
Frequently Asked Questions
How do I convert JSON to TypeScript interfaces?
Paste a JSON sample (e.g., an API response). The tool infers TypeScript types from the values: strings become `string`, numbers become `number`, booleans become `boolean`, nested objects become nested interfaces, arrays become typed arrays. Output: TypeScript `interface` declarations (or `type` aliases). Copy and paste into your `.ts` file. Powered by quicktype-core — the open-source library behind app.quicktype.io. Runs entirely in your browser; your JSON never leaves the device.
How does the tool handle nullable / optional fields?
**`null` values** in JSON → emitted as `string | null` (or whatever the type, union with `null`). **Missing fields** in some objects but present in others (within an array of objects) → emitted as optional with `?`: `name?: string`. Pure inference from one example doesn't catch nullability — providing multiple examples (a JSON array with diverse objects) gives the inferrer more signal. For 100% accuracy, the source-of-truth schema (JSON Schema, OpenAPI spec, GraphQL SDL) is more reliable than sample-based inference.
Is my JSON sent to a server?
No — generation runs entirely in your browser via quicktype-core bundled into the page. Your JSON never reaches a server, never gets logged. Verify in DevTools' Network tab: zero HTTP requests during conversion. Safe for sensitive API responses (auth-related JSON, internal endpoints, customer data shapes) — though see the next FAQ about don't paste real production data with PII.
Should I paste real API responses with sensitive data?
Best practice: **scrub PII first**. Even though the tool runs client-side (no server transit), pasting real customer emails / IDs / tokens into any web tool leaves traces — clipboard history, browser autofill, screen-capture if you share screenshots. Sanitize: replace PII with placeholder values (`'user@example.com'`, `'uuid-1234'`) before pasting. The inferred types are the same; the leaked-data risk is eliminated. For one-off lookups in a controlled environment, this is over-cautious; for habit, scrub.
What's the difference between interface and type alias?
Both define types in TypeScript. **`interface`**: extendable (`interface Dog extends Animal { ... }`), declaration-merging (multiple `interface User { ... }` blocks merge), conventional for object shapes. **`type`**: union/intersection support (`type Status = 'active' | 'inactive'`), conditional types, mapped types. For object shapes, prefer `interface` (slightly more idiomatic, faster to compile in large projects). For unions, intersections, or computed types, use `type`. This tool emits `interface` by default — switch to `type` if you need union types or extra TypeScript features.
How does it handle arrays with mixed types?
Heterogeneous arrays — `[1, 'two', true]` — become tagged unions: `(number | string | boolean)[]`. For more complex cases (an array of objects with different shapes — a 'discriminated union'), quicktype-core attempts to infer the union and emit it cleanly. Real-world tagged unions are best modeled explicitly: `type Event = { type: 'click', x: number, y: number } | { type: 'submit', formId: string }`. For arrays-of-mixed-shapes, the generator's inference is a starting point — refine manually for type-narrowing precision.
What if the JSON contains dates, UUIDs, or other strings with semantics?
By default, the generator types them as `string` — JSON doesn't have native date or UUID types; everything is text. quicktype-core has options to detect date-like strings (`'2026-05-20T10:00:00Z'`) and emit `Date` types, but this requires opting in and isn't perfect (false positives on string fields that happen to look date-like). For production code, define branded types: `type UUID = string & { readonly _: unique symbol }`. This way the type system distinguishes UUIDs from arbitrary strings without runtime cost. For most use cases, plain `string` is fine.
Can I generate types from multiple samples?
Yes — pass an array of samples. Each sample contributes to the inference: a property present in some samples but not others becomes optional; a value with multiple types across samples becomes a union. For richest inference, provide 3-5 diverse samples (different states, edge cases, optional-field combinations). For type definitions used in production code, prefer JSON Schema or OpenAPI specs as the source-of-truth — generate types from those (via openapi-typescript, json-schema-to-typescript). Sample-based inference is for quick scaffolding, not authoritative typing.
Share This Tool
Found this tool helpful? Share it with others who might benefit from it!
💡 Help others discover useful tools! Sharing helps us keep these tools free and accessible to everyone.