DEV Community

Cover image for Comparing SASS with plain CSS
Ibraheem Zafar
Ibraheem Zafar

Posted on

Comparing SASS with plain CSS

Why SASS?

Syntactically Awesome Style Sheets is a preprocessor scripting language that extends the capabilities of CSS. It provides a range of additional features and functionality that ease the development process and make stylesheets more maintainable.

Pros

  1. Sass allows developers to define variables to store values which can increase consistency and make it easier to updates styles.
  2. Sass enables developers to nest selectors within one another.
  3. Sass allows creation of mixins with arguments which help in avoiding repeating styles.

Cons

  1. Sass files use the .scss or .sass extension and must be compiled into CSS before they can be used in a web page.

Why CSS?

Cascading Style Sheet is a stylesheet language used to define the presentation and layout of a webpage written in HTML. CSS has basic features of style sheets.

Pros

  1. CSS follows a plain-text syntax
  2. CSS files are interpreted by web browsers directly

Cons

  1. CSS requires you to write each selector separately.
  2. CSS does not provide functionality to use Mixins and does not use additional features

Final Verdict

This is what I think after learning CSS and SASS:

  1. They both have a relation like a root and stem has. Without CSS, Sass is nothing and without Sass, CSS is too much repetitive and lack a lot of additional features.

  2. Sass is better to use than simple CSS because it makes it a lot easier to make new styles and use them again and again without defining new selectors using mixins.

I have completed my trainings for CSS and SASS from Codecademy, you can see my certifications

Image description

Image description

Visit My Homepage at https://devibbi.com/

Top comments (0)