๐ Runs in your browser โ nothing is uploadedโ Free, no signup
LESS Formatter
Paste LESS to format it with Prettier โ clean indentation for variables, mixins, nested rules and operations.
0 characters
Formatted LESS
When should you use the LESS Formatter?
- Tidying LESS in an older Bootstrap or Ant Design project
- Formatting minified LESS so it's readable
- Keeping stylesheet formatting consistent across a team
How to use the LESS Formatter
- 1
Paste LESS
Paste a stylesheet or snippet.
- 2
Set indentation
Choose 2 or 4 spaces or tabs and a line width.
- 3
Check errors
Syntax errors show the line and column.
- 4
Copy or download
Copy the result or download styles.less.
Examples
Variables and nesting
Before
@c:#fff;.a{.b{color:@c}}After
@c: #fff;
.a {
.b {
color: @c;
}
}Common errors and how to fix them
CssSyntaxError- Check the line in the error for a missing brace, semicolon or colon.
I need the compiled CSS- This formats LESS source but doesn't compile it. Run the LESS compiler in your build to get CSS.
More from Code Formatters & Minifiers
Free tools that run in your browser โ no signup, nothing uploaded.
SQL Formatter & Beautifier
Format SQL queries for MySQL, PostgreSQL, SQL Server, SQLite and more.
CSS Minifier & Compressor
Optimize CSS by removing whitespace and comments to accelerate page load time.
JS Minifier & Compressor
Compress JavaScript to improve website speed and performance.
XML Formatter & Validator
Format, validate and minify XML, with errors shown by line and column.
HTML Formatter & Beautifier
Beautify or minify HTML with clean, consistent indentation.
Markdown Editor & Preview
Write Markdown with a live preview and copy the HTML.
HTML to JSX Converter
Convert HTML to valid React JSX โ className, style objects and more.
SVG to React Component
Turn SVG markup into a React component with camelCase attributes.
HTML to Markdown Converter
Convert HTML to clean Markdown, including tables and code blocks.
LESS Formatter FAQ
No โ it formats LESS source code only.
Prettier, the same formatter used in editors and CI pipelines.
Yes โ mixins, guards, operations, variables and nested rules are formatted.
Yes, // and /* */ comments are preserved.
Both add variables, nesting and mixins to CSS. LESS uses @variables; SCSS uses $variables and is more common in new projects.
No. Everything runs in your browser, so your stylesheet never leaves your device.
