JSON to TypeScript, Generate Interfaces & Types Online
Paste a JSON sample and get accurate TypeScript interfaces in real time. We merge types across every array element for inference no naive converter matches, and let you toggle interface vs type, readonly, export, optional-from-null and names, all client-side, nothing uploaded.
What is the json to typescript?
Converting JSON into TypeScript, the JSON to TypeScript tool generates interfaces or types in real time, merging types across every array element for inference naive converters miss. Toggle interface versus type, readonly, export, optional-from-null and naming. Free and client-side, your JSON is turned into types entirely in the browser.
The GigAI JSON to TypeScript converter turns a sample of JSON (an API response, a config file, a fixture) into clean, idiomatic TypeScript you can paste straight into your codebase. It infers named interfaces for nested objects, arrays as element types, primitive unions for mixed values, and recognises when a field is sometimes null so it can mark it optional and union it with null. Its standout feature is deep union merging across array elements: instead of typing an array from its first item alone, it walks every element and merges their shapes, so a field that only appears on some records becomes optional and a value that is a string in one row and a number in another becomes `string | number`. That produces types that actually survive contact with real data. You control the output completely: emit `interface` or `type`, name the root, add a prefix or suffix to every generated name, make properties `readonly`, keep or drop the `export` keyword, and choose split interfaces or a single self-contained tree. Structurally identical objects are de-duplicated so repeated array items share one interface. Everything runs live as you type, entirely on your device using a dependency-free inference engine. No API response, token or schema is ever uploaded, stored or logged.
- Difficulty:
- Easy
- Typical time:
- ~15s
- Processing:
- 100% browser processing
- Converts:
- JSON → TYPESCRIPT
Last updated
How to use the json to typescript
- 1
Paste, drop or import JSON
Paste a JSON sample into the left editor, drag a .json file onto it, or load a built-in example to try it instantly.
- 2
Choose your output style
Pick interface or type, name the root, and toggle readonly, export and optional-from-null to match your project.
- 3
Refine and watch it update
Edit the JSON and the TypeScript regenerates live. De-duplicated interfaces keep the output clean even with repeated array items.
- 4
Copy, download or share
Copy the generated types, download them as a .ts file, or share a link that reopens the tool with your JSON pre-loaded.
What JSON to TypeScript includes
Merged unions across arrays
We infer array element types from every item, not just the first, fields present on some records become optional, and mixed values become precise unions like string | number instead of any.
Interface or type, your call
Emit named export interfaces for object shapes or switch the whole tree to type aliases in one click, matching your project's convention.
Optional from null
When a value is null or missing in your sample, the property is marked optional with ?, so your types match how the API actually behaves.
Readonly, export & naming
Toggle readonly on every property, keep or drop the export keyword, rename the root, and add a prefix or suffix to every generated name.
Live as you type
Types regenerate on every keystroke with a smart debounce, so you refine your JSON and watch the interfaces update instantly. No convert button.
100% in your browser
Inference runs on your device with a dependency-free engine. No JSON payload, token or schema is uploaded, stored or logged.
Why use our json to typescript
Types that match real data
By merging every array element instead of guessing from the first, the generated interfaces model the nullable and optional fields your API actually returns, so the compiler catches bugs early.
Skip the tedious typing
Turn a pasted API response into ready interfaces in seconds instead of hand-writing nested shapes and second-guessing which fields are optional.
Fits your codebase style
Interface vs type, readonly, export on or off, and prefix/suffix naming mean the output drops in without reformatting to match your conventions.
Private by design
Because inference is local, you can safely convert responses containing internal shapes, tokens or PII, none of it leaves your machine.
Built for the way you work
From quick one-off fixes to daily workflows, see how people put this tool to use.
- Frontend developer
Type an API response
Paste a payload from the network tab and get an interface for your fetch layer, with optional and union fields already inferred from the real shape.
- Backend developer
Share contracts across services
Turn a sample event or DTO into a readonly interface you can drop into a shared types package, keeping producers and consumers in sync.
- QA / Data engineer
Model a data export
Feed a multi-record JSON array in and let union merging surface the fields that are missing or differently typed across rows before they break a pipeline.
- Student
Learn TypeScript structural typing
See how a JSON object maps to interfaces, how nesting becomes separate types, and how null turns into optional, with instant, editable feedback.
Supported formats
Accepts JSON and TXT, and produces TS, all processed locally in your browser.
- JSON
- TXT
- TS
Frequently asked questions
Recommended tools
JSON Formatter
Format, validate and minify JSON in your browser with pinpoint error line + column, jump-to-error, key sorting and live editing: nothing is uploaded.
JWT Decoder
Decode and inspect any JSON Web Token instantly. Read the header, payload and signature, see when it was issued and expires, and optionally verify an HS256 signature. 100% in-browser. Your token never leaves your device.
Base64 Encoder
Encode text or any file to Base64 instantly: Unicode-safe, with a URL-safe toggle and one-click data URLs. Runs entirely in your browser, nothing uploaded.
UUID Generator
Generate secure UUIDs instantly, random v4, time-ordered v7, or the nil UUID. Bulk-generate up to 1,000, copy or export as TXT/CSV, all in your browser.
JSON Diff
Compare two JSON documents by structure, not text. Reordered keys and whitespace are ignored. You see added, removed and changed values by path with counts, all in your browser.
JSON Tree Viewer
Explore JSON as an interactive, collapsible tree. Expand or collapse any branch, see type and array-length badges, search keys and values with live highlighting, and copy any node's value or its JSONPath in one click, all 100% in your browser.
Comparisons & guides
Go deeper on the concepts behind the json to typescript.
Common problems, solved
Hit a snag? Here are quick fixes for the issues people run into most.
An array field came out as unknown[].
The array was empty in your sample, so there was nothing to infer from. Add at least one representative element and the element type will be generated. Include the fullest, most complete item so optional fields are captured.
A field I expected is missing from the interface.
It was absent from the object you pasted. Union merging only marks fields optional when they appear on some array elements and not others: a field that never appears anywhere can't be inferred. Paste a record that includes it.
The root came out as a type alias, not an interface.
When the top-level JSON is an array or a primitive rather than a plain object, a type alias is the correct representation. Wrap the value in an object, or switch the output mode to type if you prefer aliases throughout.
Numbers like 12345678901234567890 look wrong in a comment or sample.
JSON.parse coerces numbers to 64-bit floats, so integers above 2^53−1 lose precision when the sample is parsed. The generated type is still number. Keep such IDs as strings in your JSON to model them accurately.
Get the most out of it
Paste the fullest example array you have. Union merging across elements is what makes optional and mixed-type fields correct.
Turn on readonly for API-response types so downstream code can't accidentally mutate fetched data.
Add a prefix like I or a suffix like DTO to keep generated names from colliding with existing types.
Press Ctrl/Cmd+Enter to re-run and Ctrl/Cmd+S to download the .ts file.
Prefer type over interface when you want unions and aliases you can extend with intersections.
What's new
Recent updates and improvements to the json to typescript.
Initial release: live JSON to TypeScript with interface/type output, root naming, readonly, export toggle, optional-from-null, prefix/suffix and de-duplicated nested interfaces.
Added deep union merging across all array elements so optional and mixed-type fields are inferred from real data, plus curated examples and keyboard shortcuts.
Refined naming (prefix/suffix, root rename) and added byte and interface-count stats with a shareable-link option.
Keep exploring
Problems we solve
From the blog
Explore categories
Compare formats
By file type
Common tasks
Your privacy is built in
Your JSON is parsed and converted entirely in your browser using a dependency-free inference engine. It is never uploaded to any server. Nothing is stored, logged or transmitted, so you can safely convert responses containing tokens, keys or personal data. Close the tab and every trace is gone.
- Runs in your browser
- No uploads
- Nothing stored
Ready to try the json to typescript?
Free, private and instant. JSON to TypeScript runs right in your browser.