Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.4.21)
// Compass (v1.0.3)
// ----


$scotch-color-key: 'base' !default;

$scotch-colors: (
  'primary': (
    'base': #8e3329,
    'light': #d9534f,
    'dark': #c9302c
  ),
  'accent': (
    'base': #d98328,
    'light': #dd8f3d,
    'dark': #c57623
  ),
  'secondary': (
    'base': #5a1321,
    'light': #7b1a2d,
    'dark': #51111e
  ),
  'foreground': (
    'base': #191919,
    'light': #333333,
    'dark': #111111,
    'darker': #000000
  ),
  'background': (
    'base': #e9e9e9,
    'light': #ffffff,
    'dark': #dddddd
  )
);


@function scotch-color(
  $name: 'primary',
  $variant: $scotch-color-key,
  $opacity: 1
) {
  $color: null;
  
  // Get the color spectrum
  $color-spectrum: map-get($scotch-colors, $name);
  
  // Get the color variant
  @if $color-spectrum {
    $color: map-get($color-spectrum, $variant);
  }
  
  @return $color;
}

// Example usage
.button {
  background-color: scotch-color('primary');
  
  &:hover {
    background-color: scotch-color('primary, '');
  }
}

SassMeister-output.css

Invalid CSS after "...lor('primary, '": expected ")", was "');"