WebToolsHUBHow to generate TypeScript types from JSON
- Paste a JSON payload — an API response, a config file, anything valid.
- Name the root interface; nested objects become nested interfaces named after their keys.
- Toggle make-all-optional when the payload is a partial update rather than a full entity.
- Read the generated interfaces — arrays become typed arrays, nulls become unions, mixed arrays become unions of item types.
- Copy the output into a .d.ts or types file and import it wherever the payload is consumed.
Frequently Asked Questions
How are nested objects handled?
Each object level becomes its own interface, named in PascalCase after its key — an address key holding an object generates an Address interface, and the parent references it. Colliding names get numeric suffixes in declaration order.
What happens with mixed arrays?
An array whose items have different shapes produces a union of every observed item type — numbers and strings become number | string, and objects with the same shape collapse into one interface. Empty arrays fall back to unknown[] since there is nothing to infer from.
Why does null become a union?
JSON null is a real value your code must handle, so the field is typed as the base type | null — for example string | null. That forces the type system to remind you about the null case instead of failing at runtime.
Is my JSON uploaded anywhere?
No. Parsing and generation run entirely in your browser, so API responses, internal payloads and customer data never leave your machine.
Are the generated types safe to trust blindly?
They describe one sample exactly as it appeared. TypeScript types are erased at runtime, so consider validating incoming payloads (for example with a schema library) when the data comes from an external source.