Skip to main content
C C++ Java Python PHP C# HTML CSS JavaScript Bootstrap Node.js Express.js React.js Next.js Tailwind TypeScript Dart Angular Vue.js Spring Boot Django Flask ASP.NET Material UI Chakra UI Sass MongoDB MySQL Oracle C C++ Java Python PHP C# HTML CSS JavaScript Bootstrap Node.js Express.js React.js Next.js Tailwind TypeScript Dart Angular Vue.js Spring Boot Django Flask ASP.NET Material UI Chakra UI Sass MongoDB MySQL Oracle
SQL Server Firebase PostgreSQL MariaDB Swift Kotlin React Native R Julia Scala NLP ML DP NN Gen AI JUnit Jest Pytest Selenium Cypress AWS Azure Google Cloud Stack Queue Linked List Trees Graphs SQL Server Firebase PostgreSQL MariaDB Swift Kotlin React Native R Julia Scala NLP ML DP NN Gen AI JUnit Jest Pytest Selenium Cypress AWS Azure Google Cloud Stack Queue Linked List Trees Graphs
Beginner 8 planned topics Full Stack

Introduction to Sass

Learn Sass variables, nesting, mixins, and compiling CSS. Free Sass introduction for frontend developers.

Learning Outcomes

  • Compile SCSS to CSS
  • Create variables and maps
  • Write a mixin and an @include
  • Split styles with partials and @use

Overview

Sass is a CSS preprocessor. You write .scss with variables and mixins; a compiler emits CSS the browser understands.

This page introduces nesting, partials, and why mixins beat copy-paste.

Many teams still use Sass alongside or instead of utility frameworks.

What this course will cover

  1. 1. Variables
  2. 2. Nesting
  3. 3. Partials
  4. 4. Mixins
  5. 5. Modules
  6. 6. Build

Start a complete tutorial now

Full 6-level lessons are live for C, C++, Java, Python, and JavaScript. Use them while the remaining Sass lessons are added.

← All technology tutorials