Sass Course

Sass takes plain CSS and adds the things it's always been missing — variables, nesting, reusable logic — then compiles everything back down into ordinary CSS that every browser already understands.

What you'll learn

You'll start with the basics: what Sass actually is, the difference between its two syntaxes, and how a .scss file becomes a .css file your browser can read. From there you'll pick up variables, nesting, and splitting styles across multiple files with partials and the modern module system.

The second half covers what really separates Sass from writing plain CSS by hand: mixins for reusable chunks of styles, built-in color and math functions, @extend for sharing rules between selectors, and control directives like @each and @for for generating repetitive CSS programmatically instead of typing it out by hand. Every example shows real .scss input next to the exact CSS it compiles to, so you can see precisely what Sass is doing under the hood.

Lessons

  1. Introduction
  2. Variables
  3. Nesting
  4. Partials & Modules
  5. Mixins
  6. Functions & Operators
  7. Extend & Inheritance
  8. Control Directives
Where to start: this course assumes you already know CSS — see the CSS Course first if selectors, the box model, or the cascade aren't familiar yet. Once you do, start with Introduction and go in order — later lessons like mixins and control directives build directly on the variables and nesting covered early on.