Built-In Functions

In addition to allowing users to define their own functions, there are many useful functions built right into Sass. These functions are called using the normal CSS function syntax, with the addition of special Sass argument syntax.

Sass’s built-in functions are divided into a few categories:

if($condition, $if-true, $if-false) 

Returns $if-true if $condition is truthy, and $if-false otherwise.

This function is special in that it doesn’t even evaluate the argument that isn’t returned, so it’s safe to call even if the unused argument would throw an error.

SCSS Syntax

@debug if(true, 10px, 15px); // 10px
@debug if(false, 10px, 15px); // 15px
@debug if(variable-defined($var), $var, null); // null

Sass Syntax

@debug if(true, 10px, 15px)  // 10px
@debug if(false, 10px, 15px)  // 15px
@debug if(variable-defined($var), $var, null)  // null