Generated by SassMeister.com.

SassMeister-input-HTML.html

<div class="swatch swatch01">example text</div>
<div class="swatch swatch02">example text</div>

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

$basecolor: #2ECC40;

$lightest: lighten($basecolor, 30);

.swatch01 {
  background-color: $basecolor;
}

.swatch02 {
  background-color: $lightest;
}

.swatch {
  width: 5em;
  height: 4em;
  padding: 0.5em;
  color: white;
  }

SassMeister-output.css

.swatch01 {
  background-color: #2ECC40;
}

.swatch02 {
  background-color: #a8ebaf;
}

.swatch {
  width: 5em;
  height: 4em;
  padding: 0.5em;
  color: white;
}

SassMeister-rendered.html

<div class="swatch swatch01">example text</div>
<div class="swatch swatch02">example text</div>