map scss code example

Example 1: scss maps´

// define one
$font-weights: ("regular": 400, "medium": 500, "bold": 700)

// get value
@debug map.get($font-weights, "medium")  // 500
@debug map.get($font-weights, "extra-bold")  // null

Example 2: scss how to use map

// _component.scss
$configuration: (
  padding: 1em,
  margin: 0 1em,
  color: grey
);

.element {
  color: map-get($configuration, color);
  padding: map-get($configuration, padding);
  margin: map-get($configuration, margin);

  &::before {
    background-color: map-get($configuration, color);
  }
}

Tags:

Css Example