Generated by SassMeister.com.

SassMeister-input-HTML.html

<div class="foo"></div>

SassMeister-input.scss

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

// variables
//Colors
$primary-color: #fb445a;
$secondary-color: #83d6b7;

//font size
$base-font--size: 16px;

//function
@function em($pixels, $context: $base-font--size) {
  @return ($pixels / $context) * 1em;
}

//Font Families
$arial: Arial, Helvetica, sans-serif;
$comic: "Comic Sans MS", cursive, sans-serif;

//////////Variables end/////////////

.bar {
    background-color: $primary-color;
    width: 100%;
    border-radius: 5px;
  }
  
.foo {
  background-color: complement($primary-color);
  padding: em(45px);
  width: 100%;
}
////////Nesting End///////////

SassMeister-output.css

.bar {
  background-color: #fb445a;
  width: 100%;
  border-radius: 5px;
}

.foo {
  background-color: #44fbe5;
  padding: 2.8125em;
  width: 100%;
}

SassMeister-rendered.html

<div class="foo"></div>