In this blog, our Project Manager and Web Developer Matthew takes a look at CSS vs SCSS.

CSS and SCSS (Sassy CSS)

CSS, alongside JavaScript and HTML, is a staple of the World Wide Web. CSS is a styling language used to describe how a web page should be presented. CSS allows a developer (or designer) to adapt this presentation for various different screen sizes and resolutions, devices, and browsers. It allows for full control over layouts, fonts, colours (or colors, to be programmatically correct!), etc. Although CSS packs a powerful punch and has a lot to offer, it does have its limitations…

Welcome Sassy CSS!

SCSS is the perfect addition to CSS, allowing for additional leverage and syntax, and much more.

To highlight the key benefits of SCSS, I have listed them below:

  • ability to define variables;
  • ability to define mixins (groups of CSS declarations);
  • ability to write mathematical and operational functions;
  • additional (and nested) syntax;
  • minification and concatenation (compressed and combined CSS files); and
  • autoprefixing (out of the box cross-browser support).

I could go on… but I’ll save that for a future post.


– Matthew

Project Manager and Developer