It is a Css pre processor language. less provides many features like variable, operator, mixin etc just like other programming language does. It reduces the Css development time.


The following are steps for the LESS installation

Step 1:
Install nodejs and npm

Step 2:
Install less using the following command

 npm install -g less  

Step 3:
Following is a sample command for converting the less file to Css file. For that first create a file with .less extention and add the less code.

 @bodycolor: #333;   
   color: @bodycolor;     


Features of less


Variables are used to store some information, which can be used in our code where ever we want. less uses `@` symbol to declare the variable.

   width: 900px / 360px;    


less provides basic mathematical operators like +, -, *, / and %. Those are much useful in Css styling process.

    width: 900px / 360px;    


Mixin is a block of Css statements that can be used repeatedly in a program. This feature allow us to reduce the repeated Css codes. Using `#` symbol we can create mixin.

 #box($wdvar) {   
   width: $wdvar;   
 .smallbox {  
 .largebox {  


less allow us to nest our Css selectors in a way that follows the same visual hierarchy of our HTML.

  font-color: blue;   
    text-decoration: none;   

Sarav Author


  • Vivan Weaving

    (August 13, 2023 - 11:01 am)

    What’s up, after reading this awesome piece

  • Andrew Barklow

    (August 14, 2023 - 2:39 am)

    I like the helpful info you provide in your articles. I will bookmark your weblog and check again here regularly.

Leave a Reply

Your email address will not be published. Required fields are marked *