<p></p>
<p class="p0"></p>
<p class="p1"></p>
<p class="p2"></p>
<p class="p3"></p>
p{
  height:30px;
}
.p0{
  background-color:#5c7a29;
}
.p1{
  /* 
     让颜色变亮
     lighten($color, $amount)
      $amount 的取值在0% - 100% 之间
   */
  background-color: lighten(#5c7a29, 30%);
}
.p2 {
    // 让颜色变暗
    background-color: darken(#5c7a29, 15%);
}

.p3 {
    // 降低颜色透明度
    // background-color: opacify(#5c7a29,0.5);
    background-color: opacify(rgba(#5c7a29, 0.1), 0.5);
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.