Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.9)
// Compass (v1.0.0.alpha.20)
// ----

/* lighten() only works well with dark colors: */

#test {
  $color-1: hsl(100, 100, 10%);
  useful-1: 28%;
  /*= 20% lighter */
  actual-1: lightness(lighten($color-1, 20%));
  /*= 20 percentage points lighter */

  /* ========================================== */

  $color-2: hsl(100, 100, 70%);
  useful-2: 76%;
  /*= 20% lighter */
  actual-2: lightness(lighten($color-2, 20%));
  /*= 20 percentage points lighter */

  /* ========================================== */

  $color-3: hsl(100, 100, 95%);
  useful-3: 97%;
  /*= 20% lighter */
  actual-3: lightness(lighten($color-3, 20%));
  /*= white; 5 percentage points lighter */
}

SassMeister-output.css

/* lighten() only works well with dark colors: */
#test {
  useful-1: 28%;
  /*= 20% lighter */
  actual-1: 30%;
  /*= 20 percentage points lighter */
  /* ========================================== */
  useful-2: 76%;
  /*= 20% lighter */
  actual-2: 90%;
  /*= 20 percentage points lighter */
  /* ========================================== */
  useful-3: 97%;
  /*= 20% lighter */
  actual-3: 100%;
  /*= white; 5 percentage points lighter */
}