Open In App

SASS | Numeric Functions

Improve
Improve
Like Article
Like
Save
Share
Report

Just like the SASS string functions, SASS gives a simple set of functions for changing the numeric values, and these values work the way you’d like them to. Note that one can give CSS value descriptors such as “px” or “rem” to every function except “percentage()”. In that case, SASS will ignore the units, and they won’t shown in the results.

The following table lists all numeric functions in Sass:

Function Description Example
percentage(number) This method converts a unitless number to the percentage. It means, multiplies it by 100. percentage(2.5)
Output: 250
percentage(4em)
Output: syntax error
round(number) This method rounds the number to the nearest whole number. round(2.25)
Output: 2
round(2.5)
Output: 3
ceil(number) This method rounds the number up to the nearest whole number. ceil(2.25)
Output: 3
floor(number) This method rounds the number down to the nearest whole number. floor(2.25)
Output: 2
abs(number) This method returns the absolute value of the number. abs(2)
Output: 2
abs(-2)
Output: 2
min(numbers) This method returns the smallest value in the list of numbers. min(4, 5, -7, 8, 2)
Output: -7
max(numbers) This method returns the largest value in the list of numbers. max(4, 5, -7, 8, 2)
Output: 8
random() This method returns a random number in the range of [0, 1]. random()
Output: 0.4965
random(limit) This method returns a random whole number in the range of [1, limit]. random(4)
Output: 2.4652

Last Updated : 19 May, 2020
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads