What is SCSS and where to learn it

HTML-CSS
1

Hello,
I have seen that the knowledge of SCSS is desirable by employers but I am very confused about. I know that there is SASS but I’m not sure what SCSS is. Is the same library but two different names or two separate libraries?

2

SASS is a pre-processor scripting language that will be compiled or interpreted into CSS. SassScript is itself a scripting language whereas SCSS is the main syntax for the SASS which builds on top of the existing CSS syntax.

3

Yes it is slightly confusing. It’s called sass, but scss is the name of the syntax you use. Originally the library let you use one of two syntaxes, sass, and the file would be “my-stylesheet.sass”:

p:
  color: red
  font-weight: bold

or scss, file would be “my-stylesheet.scss”:

p {
  color: red;
  font-weight: bold;
}

Having two syntaxes is confusing, difficult for people trying to adopt it, difficult for maintainers of the library, difficult for people writing programs that build on the sass program itself. So the second syntax, the one that looks exactly like CSS, that one won, but the library is still called Sass: you write .scss files and use sass to turn those files into CSS.

2 Likes
4

Thank you for you answer, so when I write CSS with Sass, I should use SCSS syntax and save file as .scss?

5

Yes. I don’t think any of the programs that do that conversation (the sass compilers) actually handle .sass files any more, I might be wrong on that though

Edit: basically “sass” is much easier to say than “scss”, it’s a better name. If it had been the other way round, and “scss” had been the name for the other syntax, then wouldn’t have had the confusion,“scss” would have quietly disappeared. But there we go.

2 Likes
6

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.