Open In App

SASS | Introspection Functions

Last Updated : 16 Jul, 2021
Improve
Improve
Like Article
Like
Save
Share
Report

SASS Introspection functions allow you to inspect the conditions of SASS itself. You can not use them when you are making stylesheets, but they’re crucial for knowing what is going on when something does not work according to the way that you want. 

The following table contains all introspection functions in SASS: 

 

Function Description Example
variable-exists($name) This method returns a Boolean value that represent whether the given variable exists, either globally or locally. $x: 40px; 
variable-exists($x) 
Output: true 
variable-exists($y) 
Output: false 
 
global-variable-exists($name) This method returns a Boolean value that represent whether the given variable exists globally. $x: 40px; 
global-variable-exists($x); 
Output: true 
 
mixin-exists($name) This method returns a Boolean value that represent whether the given mixin exists. @mixin text-color {color: blue; } 
Output: true 
 
inspect($value) This methods returns the value as it is given by SASS. inspect(54) 
Output: “54” 
 
type-of($value) This methods returns a string that represent the SASS data type of the value. type-of(5 6 4 7 8 9) 
Output: “list” 
 
unit(number) This methods returns the unit associated with the number, or a null string if the number is unitless. $x: 40px; 
unit($x); 
Output: “px” 
$x: 40; 
unit($x); 
Output: “” 
 
unitless($number) This methods returns a Boolean value that represent whether the given number has a unit associated with it or not. $x: 40px; 
unitless($x); 
Output: false 
 
comparable($number1, $number2) This methods returns a Boolean value that represent whether the given numbers can be added, subtracted or compared. comparable(2em, 7em) 
Output: true 
comparable(2em, 4px) 
Output: false 
comparable(2em, 7) 
Output: true 
 

 


Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments

Similar Reads