Skip to content

What Is Less?

Less is first of all a CSS preprocessor language. CSS (Cascading Style Sheets) is the style language used to control how web pages look; Less was created to make writing and maintaining that CSS easier.

Less extends CSS and offers a more flexible way of writing styles. Its syntax lets you write less code and organise your styles better, and it adds programming features such as variables, functions and nesting.

Here is a simple Less example:

Less
@mainColor: #3498db;
body {
  background-color: @mainColor;
}
h1 {
  color: darken(@mainColor, 10%);
}

This code defines a main colour variable (@mainColor), uses it as the background colour of body and gives h1 a darker shade of the same colour. This way Less helps you write more modular and maintainable CSS.

Have a question about this article? Write to me