Post

Sass Maps

Sass maps are useful because they intice you to keep your colors and sizes organised. It’s more readable to scan through all the items listed in sass map. It can also be easier to remember values of a sass map.

And example of sass map usage.

Creating sass maps

1
2
3
4
5
$colors: (
  primary: #007bff,
  secondary: #6c757d,
  success: #28a745,
);

Implementing sass maps

1
$primaryColor: map-get($colors, primary);

Add to map

1
2
3
4
5
6
7
// Create your own map
$custom-colors: (
  "custom-color": #900
);

// Merge the maps
$theme-colors: map-merge($theme-colors, $custom-colors);
This post is licensed under CC BY 4.0 by the author.