JSON to TypeScript Converter (Generate Interfaces from JSON)
Paste JSON and get TypeScript interfaces instantly, with nested types, optional keys, union types, and a copy-ready result.
Generate TypeScript interfaces or type aliases from any JSON sample as you type. Nested objects become named interfaces, arrays of objects merge their keys so fields missing from some elements turn optional, and conflicting value types become unions. Choose the root type name, switch between interface and type declarations, and toggle the export keyword before copying the result.
Typing an API response by hand is tedious and error prone: one missed optional field or mistyped union and the compiler stops protecting you exactly where you need it. This tool reads a JSON sample and emits matching TypeScript declarations as you type. Strings, numbers, booleans, and null map to their TypeScript primitives. Each nested object becomes its own named interface, with the name derived from the property key in PascalCase, and structurally identical objects share one declaration while different shapes under the same key get a numeric suffix.
Arrays get the most useful treatment. When an array contains objects, their keys are merged across every element: a field present in some elements but not others is marked optional with ?, and a field whose values differ in type (say a price that is sometimes a number and sometimes a string) becomes a union. Empty arrays come out as unknown[] rather than a guess, null mixed with another type produces T | null, and keys that are not valid identifiers (kebab-case, spaces, leading digits) are quoted so the output always compiles.
Three options shape the output and are remembered between visits: the root type name, a switch between interface and type alias declarations, and whether each declaration carries the export keyword. Invalid JSON shows a parse error with the line and column of the failure, so fixing a trailing comma takes seconds.
- 1
Paste a JSON sample
Drop an API response or config object into the editor. Conversion runs on every keystroke; malformed JSON shows an error with the line and column where parsing failed.
- 2
Set the output options
Name the root type, pick interface or type alias declarations, and toggle the export keyword. The choices persist for your next visit.
- 3
Copy the declarations
Review the generated interfaces in the output panel, including merged array element types and optional fields, then copy everything to the clipboard with one click.
Typing a third-party API response
Paste a response from an undocumented REST endpoint and get interfaces for the whole payload, including nested objects and lists, in one step.
Migrating JavaScript to TypeScript
Feed in the JSON fixtures or config files an old module consumes to produce starter types instead of writing every interface by hand.
Catching inconsistent API fields
An array element where price comes back as number | string or a key marked optional reveals inconsistencies in the backend before they surface as runtime bugs.
Typing webhook payloads
Capture a sample payload from Stripe, GitHub, or an internal service and generate the interface your handler function should accept.
Does my JSON leave the browser?
No. Parsing and type generation run entirely in client-side JavaScript; nothing you paste is uploaded or logged, and the page keeps working offline once loaded. That makes it safe to paste responses containing real customer data.
How are arrays of objects handled?
Keys are merged across every element in the array. A key missing from some elements becomes optional, and a key whose values have different types becomes a union, so the generated element type accepts every object the array actually contains.
Why do empty arrays become unknown[]?
An empty array carries no evidence about its element type. unknown[] is honest about that and forces a narrowing check before use, whereas guessing any[] would silence the compiler exactly where the sample tells you nothing.
Should I choose interface or type?
Both produce equivalent object shapes here. Interfaces support declaration merging and often read better in compiler errors; type aliases are required if you later want to compose the result into unions or mapped types. The toggle exists because codebases standardize on one style.
What happens when two nested objects have the same key name?
If their shapes match they share a single interface. If the shapes differ, the second one gets a numeric suffix (Item, Item2) so every declaration stays unambiguous and the output compiles without edits.