Sass Installation

Beginner
10 min read
Updated: Nov 2026
5 examples
Dart Sass CLI
Install Dart Sass and compile SCSS to CSS from the command line
Definition

Definition and Usage

Install Dart Sass, then use the sass executable to compile .scss / .sass files to CSS. Browsers do not run Sass—you compile first, then link the CSS.

Official idea.

After install, run sass --version to confirm, then compile with sass source.scss dest.css.

Beginner path.

If you already use Node.js: npm install -g sass (or a project devDependency), then compile one small file.

Skip old compilers.

LibSass and Ruby Sass are retired. Start new work on Dart Sass only.

Syntax

First Commands

terminal
# Install (pick one path from the table below), then:
sass --version
sass --help

# Compile one file
sass styles.scss styles.css

# Official-style path example
sass source/stylesheets/index.scss build/stylesheets/index.css

# Watch and recompile on save
sass --watch styles.scss:styles.css

Pattern: install Dart Sass → verify the CLI → compile (and optionally watch) your stylesheet.

Reference

Choose an Install

Pick the path that matches your toolchain:

If you…Try
Use Node.js / npmnpm install -g sass or a project devDependency
Want more speed on desktop OSsass-embedded (Node) or standalone / Homebrew / Chocolatey
Prefer no NodeStandalone ZIP / .tar.gz from GitHub releases + PATH
Use Homebrew (macOS / Linux)brew install sass/sass/sass
Use Chocolatey (Windows)choco install sass
Want a GUIApps such as CodeKit (Mac) or Prepros (Mac / Windows / Linux)

Node packages: sass is pure JavaScript (widest platforms, a bit slower). sass-embedded wraps the Dart VM (faster; Windows, macOS, Linux). Both share the same JS API.

Code

Install & Compile Examples

Commands below match Dart Sass CLI usage. Open View Compiled CSS where a stylesheet is shown (verified with current Dart Sass).

Example 1 — Install with npm

Global CLI or project-local devDependency (recommended for teams).

terminal
# Global CLI (pure JS implementation)
npm install -g sass

# Or project-local
npm install --save-dev sass

# Faster Node option where supported
npm install --save-dev sass-embedded

# Other CLIs
brew install sass/sass/sass
choco install sass

How It Works

  1. npm -g puts sass on your PATH.
  2. devDependency pins the version for the repo.
  3. sass-embedded is faster on desktop OS.
  4. brew / choco install Dart Sass without Node.

Example 2 — Verify the Install

Confirm the executable and see the Dart Sass version string.

terminal
sass --version
# or, for a local install:
npx sass --version

How It Works

  1. --version proves the CLI is on PATH (or via npx).
  2. Version number changes over time—yours may differ.
  3. --help lists compile and watch flags.
  4. Success means you can compile SCSS next.

Example 3 — Compile Your First File

Write a small SCSS file, then run the CLI (or compile equivalently).

SCSS
$brand: #336699;

.button {
  background: $brand;
  padding: 0.5rem 1rem;
}
terminal
sass styles.scss styles.css

How It Works

  1. Variable stays in SCSS only.
  2. CLI writes plain CSS.
  3. HTML links styles.css, not the SCSS.
  4. Same idea for indented .sass files.

Example 4 — Compressed Output

Ship a minified stylesheet for production.

terminal
sass --style=compressed styles.scss styles.min.css

How It Works

  1. --style=compressed removes whitespace.
  2. Hex may shorten when equivalent.
  3. Same SCSS as the expanded example.
  4. More flags live on the Dart Sass CLI page.

Example 5 — Watch Mode

Recompile automatically while you edit.

terminal
# One file
sass --watch styles.scss:styles.css

# A whole directory
sass --watch scss:css

How It Works

  1. Colon form maps input to output.
  2. Process stays open until you stop it.
  3. Directory watch mirrors folders.
  4. Details on sass --watch.

Edge Cases & Pitfalls

Most install bugs are PATH issues or mixing old compilers.

PATH

Command not found

Standalone installs need the dart-sass folder on PATH. Local npm installs use npx sass.

encoding

Save source as UTF-8

Avoid odd encodings—see Sass parsing.

legacy

Do not start on LibSass / Ruby Sass

Those implementations are discontinued. Prefer Dart Sass.

speed

npm sass is slower by design

Pure JS is portable. Swap to sass-embedded or a native CLI later without changing your mental model.

Toolchain

Sass Support

What to install today:

OptionStatus
Dart Sass CLIPrimary — standalone, npm, Homebrew, Chocolatey
sass (npm)Pure JS; widest Node platforms
sass-embedded (npm)Faster Dart VM wrapper; Windows / macOS / Linux
LibSass / Ruby SassRetired — do not use for new projects

After install, continue with the Dart Sass CLI.

Remember

Key Takeaways

  • Install Dart Sass — then compile SCSS to CSS.
  • Verify with sass --version before compiling.
  • npm, brew, choco, or standalone — same CLI idea.
  • Use --watch while learning and iterating.

One line: install Dart Sass, run sass --version, then sass input.scss output.css.

Practice

Compile Notes

Practical checklist:

checklist.txt
1. Install Dart Sass (npm / brew / choco / standalone)
2. Run sass --version
3. Create styles.scss
4. Run sass styles.scss styles.css
5. Optional: sass --watch styles.scss:styles.css

Frequently Asked Questions

Dart Sass—the primary implementation. Install the CLI (standalone, npm, Homebrew, or Chocolatey) or a Node package (sass or sass-embedded). Avoid starting new work on LibSass or Ruby Sass.
Global CLI: npm install -g sass. Project-local: npm install --save-dev sass. Then run sass --version (or npx sass --version for a local install).
The npm sass package is pure JavaScript and a bit slower. sass-embedded wraps the Dart VM and is faster on Windows, macOS, and Linux. The CLI interface is the same.
After installing, run: sass source.scss dest.css. Example: sass styles.scss styles.css. Use sass --watch styles.scss:styles.css to recompile on save.
No. Browsers load CSS. You compile .scss or .sass to .css in development or CI, then link the CSS from HTML.
Both are maintained by the Sass team and share the JS API. sass is pure JS (widest platform support). sass-embedded is faster but targets Windows, macOS, and Linux via the Dart VM.

Next: Dart Sass CLI

Learn compile flags, output styles, and everyday CLI options.

Dart Sass CLI →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

8 people found this page helpful

Sass Introduction Dart Sass CLI