Black Lives Matter
Sass stands with the protesters against police violence. We encourage our users to get in the streets
and join them if you can.
(/)
Install (/install)
Learn Sass (/guide)
Blog (/blog)
Documentation (/documentation)
Get Involved (/community)
Documentation
Contents
Syntax
Style Rules
▶
▶
Variables (/documentation/variables)
Interpolation (/documentation/interpolation)
At-Rules
▶
Values
Operators
▶
▶
Built-In Modules
▶
Breaking Changes
▶
▶
Command Line
JavaScript API (/documentation/js-api)
Sass is a stylesheet language that’s compiled to CSS. It allows you to use variables
(/documentation/variables), nested rules (/documentation/style-rules#nesting), mixins
(/documentation/at-rules/mixin), functions (/documentation/modules), and more, all with a
fully CSS-compatible syntax. Sass helps keep large stylesheets well-organized and makes it
easy to share design within and across projects.
If you’re looking for an introduction to Sass, check out the tutorial (/guide).
If you want to look up a built-in Sass function, look no further than the built-in module
reference (/documentation/modules).
If you’re calling Sass from JavaScript, you may want the JS API documentation
(https://github.com/sass/node-sass#usage).
Or the Dart API documentation
(https://pub.dartlang.org/documentation/sass/latest/sass/sass-library.html) if you’re
calling it from Dart.
Otherwise, use the table of contents for the language reference!
Older Versions
This documentation is written for the most recent version of the Sass language. If you’re
using Dart Sass (/dart-sass) 1.62.1 , you’ll have access to all the features described here. But
if you’re using an older version of Dart Sass or a deprecated Sass implementation like
LibSass (/libsass) or Ruby Sass (/ruby-sass), there may be some behavioral differences.
Anywhere behavior differs between versions or implementations, the documentation
includes a compatibility indicator like this:
Compatibility (Feature Name):
Dart Sass
✓
LibSass
since 3.6.0
Ruby Sass
✗
Implementations with a “✓” fully support the feature in question, and implementations
with a “✗” don’t support it all. Implementations with a version number started supporting
the feature in question at that version. Implementations can also be marked as “partial”:
Compatibility:
Dart Sass
✓
LibSass
partial
Ruby Sass
✗
▶
This indicates that the implementation only supports some aspects of the feature. These
compatibility indicators (and many others) have a “ ” button, which can be clicked to
show more details about exactly how the implementations differ and which versions
▶
support which aspects of the feature in question.
Current Releases:
Dart Sass (/dart-sass) 1.62.1 (https://github.com/sass/dart-sass/releases/tag/1.62.1)
LibSass (/libsass) 3.6.5 (https://github.com/sass/libsass/releases/tag/3.6.5)
⚰
Ruby Sass (/ruby-sass)
Implementation Guide (/implementation)
Sass © 2006–2023 the Sass team, and numerous contributors. It is available for use and modification
under the MIT License (https://github.com/sass/dart-sass/blob/master/LICENSE).
Sass on GitHub (https://github.com/sass)
Website Source Code (https://github.com/sass/sass-site)
Style Guide (/styleguide)
Community Guidelines (/community-guidelines)
Follow @SassCSS
(https://www.macstadium.com/)