What is a .less file?
Leaner Style Sheets · Code and data · Alexis Sellier · 2009
A .less file is Less source, a CSS preprocessor that adds variables, nesting and mixins to CSS. Like Sass, it compiles to ordinary CSS, and it can even run in the browser during development.
What is a .less file used for?
Less keeps a syntax very close to CSS and was popularised by Bootstrap's early versions. Its variables and mixins reduce repetition in large stylesheets.
A Less compiler produces standard CSS for production. The files are plain text and open in any editor.
What opens a .less file?
The .less format opens in the following apps, grouped by operating system. If one app does not work, try another from the same list.
Windows
- VS Code
- WebStorm
- any text editor
macOS
- VS Code
- WebStorm
- any text editor
Linux
- VS Code
- vim
- any text editor
Open a .less file step by step
- Confirm the file really is a .less. Drop it into the WhatFileType identifier, which reads its signature in your browser without uploading anything.
- On Windows, open it with VS Code or WebStorm.
- On Mac, use VS Code or WebStorm.
- On Linux, try VS Code or vim.
- Still stuck? Convert the .less to css, which opens more widely.
Why can't I open my .less file?
Almost always because no installed app understands Less. Install one of the apps above, or convert the file to a format your existing software already reads. If double-clicking opens the wrong program instead of nothing at all, the file association is set to the wrong app rather than the file being broken.
The other possibility is that the file is not really a .less at all. Drop it into the file identifier to check it by its bytes instead of its name. Nothing is uploaded.
How to convert a .less file
You can convert a .less file to css using a conversion tool or the export menu of an app that opens it.
Less has no fixed magic number, so there is no signature table on this page. Its bytes alone do not prove the format: identification relies on the extension, the structure of the content and the program that created it. The magic-numbers reference lists the formats that do carry one.
Frequently asked questions
What is a .less file?
A .less file is Less source, a CSS preprocessor that adds variables, nesting and mixins to CSS. Like Sass, it compiles to ordinary CSS, and it can even run in the browser during development.
What is the difference between Less and Sass?
Both are CSS preprocessors with variables and nesting. Sass is more powerful and popular today; Less is simpler and was tied to early Bootstrap.
How do I compile a .less file?
Use the lessc compiler (lessc styles.less styles.css), or let your build tool convert it to CSS automatically.
How do I open a .less file?
Any text editor shows it; VS Code adds Less highlighting. The syntax looks almost identical to CSS.
Related formats
Sources
Details on this page were checked against authoritative references. How sources are ranked and what is deliberately left out is set out in the methodology.