45

I have read about SCSS and LESS. But I can't understand the differences clearly. I know SCSS and LESS both have more functionality of CSS (I mean extension of CSS).

What is different between SCSS and LESS? Which one is better?

Cœur
  • 37,241
  • 25
  • 195
  • 267
Banukobhan Nagendram
  • 2,335
  • 3
  • 22
  • 27
  • 2
    What's the difference between Python and Ruby? Lots. Likely too much to answer here. Searching "SASS vs Less" will give you many relevant hits that compare them in detail. SASS is probably better, but that's just an opinion. – Amadan Aug 24 '18 at 11:19

2 Answers2

47

Both Sass and Less are CSS preprocessors.

From keycdn.com

A CSS preprocessor is basically a scripting language that extends CSS and then compiles it into regular CSS.

So Sass and Less don't change the functionality of CSS, as they are compiled into plain old CSS. What they do is make it easier to write and maintain CSS with tools such as mixins, nesting, variables, and more.

SCSS, which stands for 'Sassy CSS' is one of two syntaxes for Sass.
From the sass reference:

The second and older syntax, known as the indented syntax (or sometimes just "Sass"), provides a more concise way of writing CSS.

The difference

Both Sass and Less have very similar features. Sass uses Ruby whereas Less uses Javascript. There are syntactical differences, for example, Sass uses $ for variables whereas less uses @.
There are some slightly more subjective differences, this website claims that "LESS Has More User-Friendly Documentation Than Sass", however personally I have found the Sass documentation and examples very easy to use.

Keir
  • 752
  • 5
  • 8
10

SCSS and LESS are both "supersets" of vanilla CSS. That means valid CSS is automatically also valid SCSS and LESS, but not necessarily the other way around.

The difference between SCSS and LESS is that they have a different syntax. They mostly have the same functionalities.

jrswgtr
  • 2,287
  • 8
  • 23
  • 49
  • There is no information about Less on that linked page. – EmSixTeen Dec 02 '22 at 11:50
  • 1
    @EmSixTeen thanks for the heads up. On the moment of writing the page had information about SCSS and LESS, but apparently they changed it. I'll remove the link from my answer. – jrswgtr Dec 02 '22 at 12:37