Output will appear here
About
The Code Formatter handles four languages in a single tool: CSS, HTML, XML, and SQL. Select the language, paste your code, and the formatter normalises indentation, adds consistent line breaks, aligns attributes, and — for SQL — uppercases reserved keywords and places each clause on its own line. The indentation style is configurable: choose 2 spaces, 4 spaces, or hard tabs to match your project conventions. Formatted output can be downloaded as a file, making it easy to replace the original without copying and pasting. All formatting runs locally in your browser — no code is ever uploaded to a server — so it is safe to format internal stylesheets, proprietary database queries, or any code you cannot share with an external service.
How to use
- 1 Select the language (CSS, HTML, XML, or SQL) from the language dropdown at the top of the editor.
- 2 Paste your code into the input panel, or click Upload to open a file from your computer.
- 3 Choose your preferred indentation style — 2 spaces, 4 spaces, or tabs — from the options bar.
- 4 Click Format; the beautified code appears in the output panel immediately.
- 5 Click Copy to copy the formatted code to your clipboard, or click Download to save it as a file.
- 6 Use the shareable URL button to generate a link that encodes the current code and language for easy sharing.
- Which languages does the code formatter support?
- The formatter supports CSS, HTML, XML, and SQL. Each uses a dedicated formatting engine: SQL keywords are uppercased and major clauses (SELECT, FROM, WHERE, JOIN) are placed on separate lines; HTML and XML attributes are consistently aligned; CSS declarations are placed one per line with normalised spacing. JavaScript, TypeScript, Python, and other languages are not currently supported.
- How is this different from a formatter built into my code editor?
- Editor formatters require installation, configuration, and often a language server. This tool works instantly in any browser with no installation — making it useful for quickly formatting a snippet from Stack Overflow, a config file emailed by a colleague, or a SQL query copied from a database client. It is also useful in environments where you cannot install extensions.
- Can I format minified CSS or HTML with this tool?
- Yes. Paste any minified or single-line CSS, HTML, XML, or SQL and the formatter expands it with proper indentation and line breaks, making it fully readable and editable.
- Does formatting change the behaviour of my code?
- No. The formatter only modifies whitespace, indentation, and — for SQL — keyword casing. It never changes selectors, property values, attribute values, or query logic. The formatted output is functionally identical to the original input.
- Is my code sent to a server?
- No. All formatting runs entirely in your browser. Your stylesheets, markup, or SQL queries are never uploaded anywhere. This makes the tool safe to use with proprietary code, internal database schemas, or any source you would not want processed by an external service.