Code Converters Tools
Inar JSON to TypeScript Converter
Convert JSON to TypeScript instantly with the free Inar JSON to TypeScript Converter. Generate clean, strongly typed TypeScript interfaces and types from JSON data quickly and accurately—ideal for developers, APIs, and web applications.
Inar JSON to TypeScript Converter
Paste JSON, get typed interfaces — instantly
Drop a JSON response, a config file or a fixture into the editor and this tool infers the
TypeScript types for you. Nested objects become named interfaces, arrays are merged into a
single element type, fields that are missing from some array items become optional, and
null turns into a proper union. Every option — export style, indentation,
array syntax, quoting, readonly modifiers — updates the output live. It even tolerates
JSONC with comments and trailing commas.
JSON input
0 lines · 0 charsTypeScript output
0 typesTry a different search term or clear the category filter.
What Is a JSON to TypeScript Converter?
From a sample value to a compile-time contract.
A JSON to TypeScript converter reads a JSON document and writes the TypeScript type that describes it. Instead of hand-typing an interface for an API response — and getting a field name or a nesting level wrong — you paste one real response and the structure is derived from the data itself.
The result is not a runtime thing. It is a compile-time contract that lets the
TypeScript compiler check every property access, every function argument and every array
element against the shape you actually receive. That is what turns a runtime
undefined is not a function into a red squiggle in your editor.
This converter does more than map each JSON value to a primitive, though. It merges every
element of an array into a single element type, so an array of objects with slightly different
keys produces one interface where the inconsistent fields are optional. It extracts nested
objects into their own named interfaces so the output reads like hand-written code. And it
turns null into a real union instead of quietly widening the type to
any.
Everything runs inside your browser. Your JSON is never uploaded, never logged and never stored on a server. Only the recent-inputs list is written to this browser's local storage, and you can clear it at any time.
How the Inference Works
Every JSON value maps to a TypeScript type — and arrays are where it gets interesting.
Scalars map one-to-one. Objects become interfaces. Arrays are the interesting case, because a JSON array can hold values of any type in any combination — so the converter has to find a single type that is valid for every element.
| JSON value | TypeScript type |
|---|---|
| "hello" | string |
| 42, 3.14, -1e3 | number |
| true, false | boolean |
| null | null (or T | null inside a union) |
| { … } | a named interface |
| [ … ] | T[] where T is the merged element type |
| [ ] | unknown[] (configurable) |
Take an array whose items do not all share the same keys:
[
{ "id": 1, "name": "Alpha", "email": "a@x.com" },
{ "id": 2, "name": "Beta" },
{ "id": 3, "name": "Gamma", "email": "g@x.com", "phone": "555-0100" }
]
The converter tracks how many array items contained each key. id and
name appear in all three, so they are required. email and
phone appear in fewer than three, so they become optional:
export interface Root {
id: number;
name: string;
email?: string;
phone?: string;
}
This is the single most useful thing the converter does. A hand-written interface for this
data would almost certainly mark email as required and then fail at runtime on
the second record.
Objects nested inside other objects, and objects inside arrays, are pulled out into their own
named interfaces. The name is derived from the property key, singularised for arrays and
converted to PascalCase — so items becomes Item,
children becomes Child, and full_name becomes
FullName. Collisions get a numeric suffix rather than overwriting each other.
By default, a field that is sometimes null becomes a union:
nickname: string | null. That is the accurate description of the data, and with
strictNullChecks on it forces you to handle the null case. If you would rather
model it as an optional property, switch Null fields to
Optional ?.
The types are only as good as your sample. Inference describes the JSON you pasted, not every response the endpoint can ever return. An optional field that happened to be present in all of your samples will be marked required. Paste the largest and most varied payload you have — ideally several — before you trust the result in production.
Features
Everything the conversion needs, and the options you actually reach for.
Live conversion
The output updates as you type. No button needed, unless you turn live mode off.
Array merging
Every element is merged into one type, with keys missing from some items marked optional.
Nested interface extraction
Objects become named interfaces derived from the property key, singularised for arrays.
Interface or type alias
Emit export interface X { … } or export type X = { … } with one switch.
Nullable unions
null becomes T | null, or an optional property if you prefer.
JSONC tolerance
Optionally accept // and /* */ comments and trailing commas.
Precise error locations
Invalid JSON is reported with the line, column and a snippet showing exactly where parsing stopped.
21 worked examples
API responses, GraphQL connections, webhooks, configs, i18n, trees, k8s manifests and more.
Searchable gallery
Filter examples by category and search by name, topic or JSON key.
Full option set
Root name, export style, indentation, array syntax, key quoting, readonly, semicolons.
Recent inputs
The last ten JSON documents you converted are kept locally for quick recall.
Privacy first
100% client-side. Your JSON never leaves your browser.
How to Use It
Four steps from raw JSON to typed code.
Paste your JSON
Drop a full API response, a config file or an array of records into the left panel. If the document has comments or trailing commas, switch on allow JSONC first.
Give the root a name
Type the name you want for the top-level type into Root name — for example
ApiResponseorUser. Everything nested is named automatically from the property keys.Adjust the style
Pick interface or type alias, choose your indentation and array syntax, and decide whether nested objects should be extracted into separate declarations. The output updates on every change.
Copy or download
Press Copy TS to put the result on your clipboard, or Download to save it as a
.tsfile ready to drop into your project.
Tips for Better Types
Inference is a starting point, not a finished schema.
Paste the widest sample you have
Inference only knows what it sees. A response captured on a quiet Tuesday will not reveal that discount is sometimes present and deletedAt is sometimes null.
Then narrow the primitives
Inference produces string for every JSON string — including timestamps, UUIDs, emails and enums. The most valuable edit you can make afterwards is tightening those to template literal types or string unions.
Watch out for empty arrays
An empty array in your sample tells the converter nothing, so it becomes unknown[]. Paste a populated example, or fill the type in by hand.
Validate at the boundary, not everywhere. These types describe a shape but cannot prove that a runtime response matches it. Pair the generated interfaces with a runtime validator at your API boundary — then the rest of your codebase can trust the types without checking again.
Frequently Asked Questions
The questions people ask most about JSON to TypeScript conversion.
Is my JSON uploaded anywhere?
No. Parsing, inference and code generation all happen inside your browser. Nothing is sent to a server. The recent-inputs list is stored in this browser's local storage and you can clear it from the Recent tab.
How does it decide which properties are optional?
When an array contains objects, the converter counts how many of them contain each key. A key present in every item is required; a key missing from at least one item is marked optional with ?.
Why is my array typed as unknown[]?
Because the array in your sample is empty. There is no element to infer from, so the safest type is unknown[]. You can change the fallback to any[] or never[] in the options.
Can it handle JSON with comments?
Yes, if you switch on allow JSONC. The converter strips // and /* */ comments and removes trailing commas before parsing.
How are nested objects named?
From the property key, converted to PascalCase. Keys inside arrays are singularised first, so items produces Item and children produces Child. If two generated names collide, a numeric suffix is added.
Can I keep the types inline instead of extracting them?
Yes. Switch off extract nested and the whole document becomes a single deeply nested type with no additional declarations.
Are the generated types safe to use in production?
They are a faithful description of the JSON you pasted — no more. Treat them as a strong first draft: review them, tighten strings to unions or template literals where you know the domain, and validate incoming data at runtime before trusting it.
Can I convert a root-level array?
Yes. If the document is an array, the converter emits a type alias for the array plus a named interface for its element type.
Is the JSON to TypeScript converter free?
Yes. It is completely free to use, with no account, no sign-up and no usage limits.
More Inar Developer Tools
More free, privacy-friendly tools from Inar Learn — built for developers and learners.
Inar Learn