Generated by SassMeister.com.

SassMeister-input-HTML.html

<h1 class="foo">I am foo</h1>
<h1 class="bar">I am bar</h1>

SassMeister-input.scss

// ----
// libsass (v3.1.0)
// ----

@function color($color, $tone: 'base') {
  @return map-get(map-get($palettes, $color), $tone);
}

@mixin try-colors() {
  @each $palette, $items in $palettes {
    @each $name, $value in $items {
      /* color: #{$value}; */
      /* background-color: #{$value}; */
    }
  }
}

// ==========================================================================
// Global Variables - Colors
// ========================================================================== */

$palettes: (
  orange: (
    base: #ff7900,
    light: #FEBD3B,
    x-light: #FBD54D
  ),
  red: (
    base: #CF003C,
    dark: #991933
  ),
  brown: (
    base: #945413
  ),
  green: (
    base: #6CBE22
  ),
  blue: (
    base: #0070D0,
    dark: shade(#0070D0, 40%)
  ),
  gray: (
    base: mix(#91959a, #282F36),
    light: #91959a,
    dark: #282F36
  ),
  white: (
    base: #FFFFFF,
    transparent: hsla(0, 0%, 100%, 0)
  ),
  black: (
    base: #000000
  )
);

// Semantic Colors
$color--text: color(black);
$color--link: color(black);
$color--border: color(gray, dark);
$color--border-active: color(black);
$bg-color: color(white);

.foo {
  color: color(orange);
  background: color(gray, dark);
}

.bar {
  @include try-colors();
}

SassMeister-output.css

.foo {
  color: #ff7900;
  background: #282F36; }

.bar {
  /* color: #ff7900; */
  /* background-color: #ff7900; */
  /* color: #FEBD3B; */
  /* background-color: #FEBD3B; */
  /* color: #FBD54D; */
  /* background-color: #FBD54D; */
  /* color: #CF003C; */
  /* background-color: #CF003C; */
  /* color: #991933; */
  /* background-color: #991933; */
  /* color: #945413; */
  /* background-color: #945413; */
  /* color: #6CBE22; */
  /* background-color: #6CBE22; */
  /* color: #0070D0; */
  /* background-color: #0070D0; */
  /* color: shade(#0070D0, 40%); */
  /* background-color: shade(#0070D0, 40%); */
  /* color: #5c6268; */
  /* background-color: #5c6268; */
  /* color: #91959a; */
  /* background-color: #91959a; */
  /* color: #282F36; */
  /* background-color: #282F36; */
  /* color: #FFFFFF; */
  /* background-color: #FFFFFF; */
  /* color: rgba(255, 255, 255, 0); */
  /* background-color: rgba(255, 255, 255, 0); */
  /* color: #000000; */
  /* background-color: #000000; */ }

SassMeister-rendered.html

<h1 class="foo">I am foo</h1>
<h1 class="bar">I am bar</h1>