TypeScript Formatter

What is TypeScript Formatter?

Paste TypeScript and get it formatted instantly using Prettier, the same formatter used by most modern JS/TS codebases: consistent indentation, quote style, semicolons, and line breaks, without a build step, a project setup, or installing anything locally. It handles the same syntax full TypeScript projects use, including interfaces, generics, and type annotations, since it runs through Prettier's real TypeScript parser rather than a generic JS formatter. Formatting happens live as you type, and Prettier and its plugins are loaded only on this page (not bundled site-wide), keeping other pages lean. Nothing you paste is sent to a server; parsing and formatting both happen in your browser.

How to Use the TypeScript Formatter

1. 1

   Paste the TypeScript: Enter TypeScript code, including interfaces, generics, or type annotations.

2. 2

   Read the Formatted Result Instantly: The consistently styled output appears automatically as you type.

3. 3

   Copy the Result: Use the copy button to copy the formatted code.

How It Works

Prettier's real TypeScript parser reads your code into an AST, the same way a build tool would, then re-prints it with a consistent set of style rules: quote style, semicolons, indentation, line-wrapping for long lines, and spacing around type annotations and generics. Because it uses a genuine TypeScript parser rather than a generic JS one, interfaces, generics, and type syntax are formatted correctly rather than just treated as plain text.

Example

interface User{name:string,age:number}
function greet(u:User):string{return `Hi ${u.name}`}

interface User {
  name: string;
  age: number;
}
function greet(u: User): string {
  return `Hi ${u.name}`;
}

The interface's fields each move to their own line, and the function body gets standard brace spacing and semicolons.

Common Use Cases

Cleaning up a snippet before pasting it into a pull request or documentation, or getting consistent formatting on code copied from a source with different style conventions, without a local project setup or build step.