Skip to content

Sass: Map Functions

How to use Sass map functions like map-get, map-merge, map-keys, and more to manipulate key-value pairs in immutable maps.

In Sass, the map data type represents one or more key value pairs.

Sass maps are immutable. The map functions that return a map return a new map; they do not change the original arguments.

You can use any of the list functions with maps as well; the map will be treated as a set of two-element lists. For example:

nth(("red": #ff0000, "green": #00ff00), 2) //returns ("green" #00ff00)

Sass Map Functions

The following table lists all map functions in Sass:

Function Description Example Result
map-get($map, $key) Returns the value associated with the specified key map-get(("red": #ff0000, "green": #00ff00), "green") #00ff00
map-merge($map1, $map2) Returns a map containing $map2 appended to the end of $map1 map-merge(("red": #ff0000, "green": #00ff00), ("blue": #0000ff) ("red": #ff0000, "green": #00ff00, "blue": #0000ff)
map-remove($map, $keys) Returns a map without the specified keys map-remove(("red": #ff0000, "green": #00ff00), "red") ("green": #00ff00)
map-keys($map) Returns a list of the keys in the specified map map-keys(("red": #ff0000, "green": #00ff00)) ("red", "green")
map-values($map) Returns a list of the values in the specified map map-values(("red": #ff0000, "green": #00ff00)) (#ff0000, #00ff00)
map-has-key($map, $key) Returns a Boolean value indicating whether the specified map contains the specified key map-has-key(("red": #ff0000, "green": #00ff00), blue) false
Navigation