See the Tutorial List

SASS @ Rules(At-Rules)

The SASS At-Rules or @ rules provide most of the extra functionality which SASS provides like defining functions and then using them, using loop in your CSS, flow control and a lot more.

There are different types of At-rules which have a prefix @ where each of the At-rules available in SASS is having a special purpose which makes it even more interesting and easier to code complex styling rules.

If you want to define a function, or use conditional statements or use a loop in your styling code or if you simply wish to debug the styling code, using these @ rules we can easily do all this, as there are specific @ rules available in SASS to provide all these features.

Following are the @ rules available in Sass:

  1. @use

  2. @forward

  3. @import

  4. @mixin and @include

  5. @function

  6. @if, @else and @elseif

  7. @for

  8. @each

  9. @while

  10. @extend

  11. @at-root

  12. @error

  13. @warn

  14. @debug

  15. @media

We will be covering all these @ rules of Sass with code examples in the upcoming tutorials.