Installing Sass on Windows/Linux/Mac platform.
What is Sass?
Sass(Syntactically Awesome StyleSheets) is an extension of CSS that adds power and elegance to the basic language. It allows you to use variables, nested rules, mixins, inline imports, and more, all with fully CSS-compatible syntax and adds features to combat shortcomings. Sass helps keep large stylesheets well-organized, and get small stylesheets up and running quickly; particularly with the help of the Compass style library. It is a preprocessor like CoffeeScript & Haml
![]() |
Flow of Sass |
Sass has a Ruby dependency and we need to install Ruby first before starting with Saas installation.
Linux Platform
We can install Ruby through the apt package manager, rbenv, or rvm.
sudo apt-get update
sudo apt-get install ruby-full rubygems
Windows Platform
The promptest method to get Ruby on our Windows computer is to use Ruby Installer. It’s a single-click installer and will create the full package .The installer will also install a Ruby command line powershell application that will let us use the Ruby libraries.
Mac Platform
Ruby is pre-installed on Mac.
Check Ruby Version to verify installation
ruby –version
Steps to follow:-
Open your Terminal or Command Prompt. On Windows, Start -> Run, then type “cmd” in Run to launch it.
On the Mac the Terminal.app comes installed by default. It’s located in the “Utilities” folder.
Install Sass. Ruby uses Gems to manage its various packages of code like Sass. Open terminal or command prompt window and type:
For Linux/Mac, you will need to use the sudo command to install the Sass gem. It would look like:
![]() |
Installation on windows |
![]() |
Installation on Linux/Mac |
This will install Sass and any of its dependencies.After successful installation we can cross-check it:
![]() |
Verify installation of Sass |
If you face the following error while installing Sass,
It means, your HOMEDRIVE is set to P.Execute the following command in command prompt or power-shell to set it to C or where you have installed ruby.
SET HOMEDRIVE=C:
You can check the HOMEDRIVE by running SET HOMEDRIVE
In next post, we are going to discuss about how to write styles using Sass.