Generated by SassMeister.com.

SassMeister-input-HTML.html

<div class="buttons">
  <a class="gray" href="#">
    Default 
  
  </a>
  
  <a class="blue" href="#">
    Primary
  </a>
  
  <a class="green"href="#">
    Success
  </a>
  
  
  <a class="light-blue"href="#">
    info
  </a>
  <a class="orange"href="#">
    warning
  </a>
  <a class="red"href="#">
 danger
  </a>
  
  
  
  
  
</div>

SassMeister-input.scss

// ----
// Sass (v3.3.14)
// Compass (v1.0.0.rc.1)
// ----

a {
  padding: 20px;
  border: solid 1px black;
  display: inline-block ;
  vertical-align:top;
  text-decoration: none;
  }
  
.gray {
  border-color:gray;
  color:black;
  background-color: white;
  
}

.blue {
  background-color:#368EC6;
  color: white;
}

.green {
  background-color:#50B667;
}

.light-blue {
  
}

.orange {
  
}

.red {
  
}
  
  

SassMeister-output.css

a {
  padding: 20px;
  border: solid 1px black;
  display: inline-block;
  vertical-align: top;
  text-decoration: none;
}

.gray {
  border-color: gray;
  color: black;
  background-color: white;
}

.blue {
  background-color: #368EC6;
  color: white;
}

.green {
  background-color: #50B667;
}

SassMeister-rendered.html

<div class="buttons">
  <a class="gray" href="#">
    Default 
  
  </a>
  
  <a class="blue" href="#">
    Primary
  </a>
  
  <a class="green"href="#">
    Success
  </a>
  
  
  <a class="light-blue"href="#">
    info
  </a>
  <a class="orange"href="#">
    warning
  </a>
  <a class="red"href="#">
 danger
  </a>
  
  
  
  
  
</div>