“Which CSS preprocessor language should I choose?”
is a hot topic lately. In online debate this questions appears almost every day.
A CSS preprocessor is a scripting language that extends CSS and then compiles it into regular CSS.
By switching from CSS to a preprocessor can help streamline your development process. One of the biggest advantage is probably not having to repeat yourself. Here are some other advantages:
- Cleaner code with reusable pieces and variables
- Saves you time
- Easier to maintain code with snippets and libraries
- Calculations and logic
- More organized and easy to setup
.
CSS processor | Logo | Website |
---|---|---|
SASS | ![]() |
sass-lang.com |
LESS | ![]() |
lesscss.org |
STYLUS | ![]() |
learnboost.github.io/stylus |

Source: 2015 Survey from ashleynolan.co.uk Disclaimer: these are just responses from a small portion of developers.
Migrating to another preprocessor might be an important decision, take the time to see a comparison between the preprocessors, you might want to stay with your current one or change the preprocessor you want to migrate to.
to Less | to Sass | to Stylus | |
---|---|---|---|
from Less | Less to Sass (guide) less2sass (ruby gem) | less2stylus (GitHub) | |
from Sass | grunt-refactor (GitHub) | SassMeister (Sass ⇄ SCSS) | Sass2Stylus Ruby Sass2stylus (GitHub) |
from Stylus | Stylus to Sass (guide) | ||
from CSS | BeautifyTools toki-woki.net/p/least (indent only) fishsticss.com (indent and color vars only) grunt-refactor (GitHub) Lessify | BeautifyTools toki-woki.net/p/least (indent only) fishsticss.com (indent and color vars only) css2compass css2scss | BeautifyTools toki-woki.net/p/least (indent only) |
Here is how to install Sass and LESS:
SASS
On newer versions of Linux and OSX, Ruby already comes preinstalled. You can install Sass with the following command. sudo gem install sass
There are also other libraries, such as libSass that brings Sass to NodeJS.
On Windows, you will need to first install Ruby. If you are on a Mac, Ruby already comes preinstalled.
- Open up your terminal or command prompt
- Install Sass
sudo gem install sass
LESS
LESS is written in javascript so you will need NodeJS to run it.
- On Linux and Mac, you can install it using the following command.
npm install -g less
- You can then use this command to compile to CSS.
lessc styles.less styles.css
On Windows you will need to install the NodeJS installer.
- Open up your command prompt
- Run
npm install less
- You can then use this command to compile to CSS.
lessc styles.less styles.css
No Comments Yet