$colors-variations: (red: (100: #F2D5DE,
    800: #BC2E5B),
  pink: (100: #F8DBEC,
    800: #DC499F),
  purple: (100: #D0B0D2,
    800: #8A3A8E),
  indigo: (100: #9BBDD9,
    800: #0559A1),
  cyan: (100: #B8E6F9,
    800: #4EC1F0),
  blue: (100: #B1CCE6,
    800: #3D80C0),
  turquoise: (100: #BEE5ED,
    800: #5CBED1),
  bluish-purple: (100: #B3C5E1,
    800: #426DB3),
  green: (100: #A1E0D1,
    800: #14B18D),
  dark-green: (100: #99C6CF,
    800: #426DB3),
  yellow: (100: #FDE5A7,
    800: #FABD23),
  orange: (100: #FDD5A7,
    800: #FA9723),
  violet: (100: #B3B8D4,
    800: #404F94),
  lavender: (100: #C8C2DE,
    800: #7566AC),
  magenta: (100: #EAD2E6,
    800: #961D80),
  greenish-yellow: (100: #D1E5A7,
    800: #8CBD23),
  grey: (100: #F5F5F5,
    200:#E1E1E1,
    300:#B7B6B6,
    400:#606060,
    800: #474747),
  primary: (100:#D1E3F5,
    400:#1D4F7E,
    600:#1A446E,
    800: #0F3859,
  ),
  secondary: (100: #D8F1F4,
    800: #3BBAC8),
);

@each $name,
$variations in $colors-variations {

  @each $number,
  $color in $variations {
    .#{$name}-#{$number} {
      color: $color
    }

    .bg-#{$name}-#{$number} {
      background-color: $color !important;
    }

  }
}

@function getColor($name, $number: 800) {
  $color: map-get(map-get($colors-variations, $name), $number);
  @return $color;
}