TypeScript to Mock JSON Generator
Paste a TypeScript interface and generate realistic mock JSON that conforms to it, right in your browser. Your code stays on your device.
Your TypeScript interface is parsed and mocked locally in your browser and is never uploaded, and the generated data is random sample data, not real records.
Have JSON already? Turn it into TypeScript with JSON to TypeScript.
About TypeScript to Mock JSON
This TypeScript to mock data tool takes an interface or type alias you paste and generates realistic mock JSON that matches its shape. It reads the type structure and picks a fake value for every property, choosing by both the field name and the declared type: an email field becomes a plausible email, name becomes a full name, createdAt becomes an ISO date, id becomes a UUID or number, and plain strings become words. Nested interfaces, inline objects, arrays, string-literal unions, optional members and Date are all handled, and you control how many objects to produce and whether optional fields appear. Use it to seed tests, prototype API responses, or fill a UI with sample data instead of hand-writing fixtures. Everything runs in your browser, so the interface you paste is processed locally and never leaves your device.
Features
- Reads any TypeScript interface or type alias and infers a matching JSON shape
- Chooses fake values by field name — email, name, phone, url, uuid, date and more
- Falls back to the declared type when no name hint matches (string, number, boolean, null)
- Recurses into nested interfaces, inline object types and referenced types
- Expands array fields like tags: string[] into several generated items
- Picks one branch of a string-literal union such as 'admin' | 'editor'
- Toggle optional (prop?:) fields on or off and generate 1 object or an array of many
- Copy the JSON or download it as a .json file with one click
How to use the TypeScript to Mock JSON
- Paste a TypeScript interface or type alias into the input box.
- Set how many objects to generate and whether to include optional fields.
- If you pasted several interfaces, pick which one to use as the root.
- Read the generated mock JSON on the right, then Copy it or download a .json file.
Example
Input
interface User {
id: number;
fullName: string;
email: string;
role: 'admin' | 'editor' | 'viewer';
tags: string[];
}
Output
{
"id": 4821,
"fullName": "Ada Lovelace",
"email": "ada.lovelace@example.com",
"role": "editor",
"tags": [
"design",
"api"
]
}
Field names steer the fake values, while the union field resolves to one of its members.
Common errors & troubleshooting
- The output shows "No TypeScript interface or type alias found". — Paste a real declaration such as interface User { id: number } or type User = { id: number }; a bare value or expression has no shape to mock.
- A referenced type comes out as a plain word instead of a nested object. — Include the referenced interface in the same paste. Only types defined in the pasted source can be expanded; unknown or imported types fall back to a string.
- An enum or a complex mapped type is not expanded the way you expect. — Convert enums to a string-literal union (e.g. 'a' | 'b') so a member can be picked; unusual constructs fall back to a plausible string.
- Optional fields keep appearing (or never appear). — Use the Optionals toggle. When it is off, every prop?: member is omitted; when it is on, optional members are always included.
Frequently asked questions
- How are TypeScript field types turned into fake values?
- Each property is matched first by its name — email, name, phone, url, uuid, createdAt and similar hints map to matching fake data — and otherwise by its declared type, so string, number, boolean and null each get a sensible generated value.
- Does it support nested interfaces, arrays and unions?
- Yes. Nested interfaces and inline object types are expanded recursively, array types like string[] become several generated items, and a string-literal union such as 'admin' | 'editor' resolves to one of its members.
- Can I generate an array of many objects at once?
- Yes. Set the object count above 1 and the tool returns a JSON array of that many generated objects; a count of 1 returns a single object rather than an array.
- How are optional properties handled?
- Members marked optional with prop?: are controlled by the Optionals toggle. Turn it on to always include them, or off to omit every optional field from the output.
- What happens with a Date field or an ISO timestamp?
- A Date type, and name hints like createdAt, updatedAt or timestamp, produce an ISO 8601 date string so the mock JSON stays valid and easy to parse.
- Is the TypeScript I paste sent anywhere?
- No. The interface is parsed and the mock JSON is generated entirely in your browser, so the code you paste is processed locally and never leaves your device.
Related tools
All ArrayKit tools