TypeScript Formatter
This TypeScript formatter parses the file as TypeScript, so the type-level syntax formats correctly: interfaces, generics with long parameter lists, conditional and mapped types, satisfies expressions, decorators and TSX. It formats rather than type-checks — a file can be perfectly formatted and still not compile, because type errors need the compiler along with your whole project, its imports and its configuration, which is outside what a single-file formatter can see. Syntax errors are caught and reported with their position.
How it works
Formats TypeScript including the type-level syntax — interfaces, generics, conditional and mapped types, decorators and TSX.
Only formatting is performed. Type errors are not reported, because that needs the compiler and your whole project, not a single file.
Everything runs in your browser — nothing you paste is sent to a server.
How to format TypeScript online
- Paste your code into the input on the left.
- Set indent, wrap width, quote style and semicolons.
- Copy or download the formatted code.
Type syntax is handled too
Interfaces, generics with long parameter lists, conditional and mapped types, satisfies, decorators
and TSX all format correctly, because the file is parsed as TypeScript rather than as JavaScript with unfamiliar
tokens in it.
Formatting, not type checking
A file can be perfectly formatted and still not compile. Type errors need the compiler and your whole project —
its imports, its tsconfig, its dependencies — so they are outside what a single-file formatter can
see. Syntax errors, on the other hand, are caught and reported with their position.
Common use cases
- Formatting a file before opening a pull request.
- Tidying generated types into something readable.
- Applying consistent style to a snippet from documentation.
Frequently asked questions
Does it check my types?
No. Type checking needs the compiler plus your whole project — imports, tsconfig, dependencies — which a single-file formatter cannot see. Syntax errors are caught and reported; type errors are not.
Is TSX supported?
Yes. TSX formats correctly, including generic components and type assertions inside JSX expressions.
Which type syntax is handled?
Interfaces and type aliases, generics with constraints and defaults, conditional and mapped types, template literal types, satisfies expressions and decorators.
Can I match my project style?
Yes — indent size, wrap width, quote style and semicolons are all options.
Is my code uploaded anywhere?
No. Everything runs entirely in your browser, so nothing you paste is transmitted or stored on a server.
Related tools
JavaScript Formatter & Beautifier
This JavaScript formatter reparses your code and prints it from the syntax tree, so the result is predictable.
JSON to TypeScript Converter
This JSON to TypeScript converter turns a sample payload into exported interfaces.
HTML Formatter & Beautifier
This HTML formatter re-indents markup using a real parser, so nesting and inline elements are handled correctly.