Less Formatter
FormattersFormat Less stylesheets with Prettier. Handles variables, mixins, nesting, @import, and all Less-specific directives. Configurable indent. 100% browser-based.
About Less Formatter
The Less Formatter is a Prettier-powered, browser-based tool that instantly reformats Less stylesheets into clean, consistently indented output. Using Prettier's postcss parser with the Less dialect, it handles the full Less language — `@variables`, parameterised mixins, nesting with ampersand (`&`) references, operations and functions, `@import`, `@plugin`, and all Less-specific directives. Configurable indentation and an 80-column print width produce output consistent with modern Less project conventions. All formatting runs in a Web Worker; your stylesheets never leave the browser.
Features
- ✓Powered by Prettier's postcss parser with full Less dialect support
- ✓Handles @variable declarations and inline arithmetic operations
- ✓Supports parameterised mixins (.mixin(@arg)) and mixin guards
- ✓Full nesting support with & parent selector references
- ✓@import, @plugin, and Less namespaces (# and . namespaces)
- ✓Configurable indentation: 2 spaces, 4 spaces, or tab; print width 80
- ✓Web Worker execution — formatting never blocks the UI
- ✓Syntax-highlighted editor for both input and output
- ✓One-click clipboard copy of formatted output
- ✓Real-time byte-savings stats (input vs output size)
- ✓Language picker — instantly switch to SCSS, CSS, or 20+ other formatters
- ✓Mobile-responsive layout with a dedicated Format button
- ✓100% client-side — your stylesheets are never uploaded
Common Use Cases
- Formatting Bootstrap Less source files before customising themes
- Normalising Less variable and mixin formatting in a team codebase
- Cleaning up auto-generated or minified Less before debugging
- Preparing readable Less snippets for code reviews or documentation
- Standardising indentation and nesting depth across a component library
Frequently Asked Questions
QWill this compile Less to CSS?
No — this tool formats Less source for readability. To compile Less to CSS, use the Less Compiler tool.
QWhich Less features are supported?
All core Less features — @variables, parameterised mixins, nesting, operations, built-in functions, @import, namespaces, and mixin guards.
QIs my Less sent to a server?
No. All formatting runs locally in a Web Worker inside your browser. Your stylesheets never leave your device.