Sass mixin for CSS Heart Shape

heart_shape.scss

// border-radius(), transform() and transform-origin() mixins are from Compass.
// http://compass-style.org/

@mixin heart($width: 50px, $color: hotpink) {
  $half: ($width / 2);
  $height: ($half * 1.6);
  
  display: inline-block;
  position: relative;
  width: $width;
  height: $height;
  
  &::before,
  &::after {
    position: absolute;
    content: "";
    left: $half;
    top: 0;
    width: $half;
    height: $height;
    background: $color;
    @include border-radius($half $half 0 0);
    @include transform(rotate(-45deg));
    @include transform-origin(0, 100%);
  }
  
  &::after {
    left: 0;
    @include transform(rotate(45deg));
    @include transform-origin(100%, 100%);
  }
}