...

Sassy CSS, or more specifically the SCSS varient is a CSS Superset for the smart.

While many features of SCSS have been added to Vanilla CSS I believe they are not nearly as good as SCSS's version.

Let me show you

file.scss
      
// SCSS
$variable: #ffffff;
tag-a {
  tag-b {
    // Run this if tag-b is within tag-a
    }
  }
@if $variable == #ffffff {
  // Run this
  } @else if $variable == #000000 {
    // Run this
  } @else {
    // Run this
  }
      
// VS
      
// Vanilla CSS
var(--variable, #ffffff)
tag-a tag-b {
  // Run this if tag-b is within tag-a
  }
      
      

One of the great parts about SCSS is that because its a superset of CSS any valid CSS is valid SCSS.

But how do we turn SCSS into CSS? Via THE COMPILER

terminal

sass file.scss file.css

A CSS file will be outputed that is valid to be added to a HTML file

index.html

<link href="file.css" rel="stylesheet">

Now its time for you to write 4 billion if statements again