by in Developer Notes

What is Sass (SCSS) and Less? Sass and Less are pre-processors that extend CSS (Cascading Style Sheets). They add features that allow variables, mixins, functions and many other techniques that allow you to make CSS that is more maintainable, themeable and extendable.

They both have similar functions and syntax with minor differences. In Less, variables are called using @variable in Sass they are called using $variable. They both can work in node, in the browser and frameworks. I mainly started using sass and less using Drupal 8 and the Bootstrap framework. I started using Less with bootstrap 3 and really liked the mixins the variables and functions, it’s like CSS on steroids. Bootstrap 4 switched to Sass. Both of these pre-processors make it easy to get up and running quickly and simplify and extend writing CSS.

I use the Atom text editor to write and compile the styles. Atom has packages that will set up the compiling to work on your computer. I like compiling because you can separate the Sass/Less into different files and then pull them all into one file.  This also helps to limit the server requests. Both Sass and Less use compiling as part of the workflow.

With the bootstrap sub-theme I can pull in all the bootstrap styles, and overwrite the variables and have a really good base theme very quickly.  You can change, the colors, text, fonts etc., just by changing the variables. Then I detail everything further using CSS .

Sass and Less take time and work to set up and configure. But once they are set up it will help speed up your workflow . I am starting to use Sass more personally because that is what bootstrap is using. But they both are great pre-processors, give them a shot!


Leave a Reply

You must be logged in to post a comment.

About Leon Rainbow

Leon is primary lead for Inforest Communications graphic and Web design services. He has over ten years experience in Web design and development and is proficient working with open­source CMS systems. He holds an associates degree in Computer Graphics from Mercer County Community College. Leon Rainbow is also a well known artist in Mercer County who creatively combines graffiti, street art and other artistic forms into innovative projects and events. He reaches out to wide audience, from galleries to the walls of inner cities. Leon curates two annual art festivals in New Jersey for area painters and the community as well as dedicating his civic duty to teaching after­school art programs in Trenton and Princeton, NJ.