I <span class="heart"></span> you.

body {
  background: #333;
  color: #fff;
  font-family: 'Archivo Black', sans-serif;
  font-size: 3em;
  margin-top: 1em;
  text-align: center;
  text-transform: uppercase;
}

$sqrt2: 1.4142135623730951;
$width: 2 + $sqrt2;
$height: 1 + $sqrt2 * 1.5;

$wedgeWidth: 100% * $sqrt2 / $width;
$wedgeHeight: 100%  * $sqrt2 / $height;
$wedgeXPos: 100% * (1 - $sqrt2 / 2) / ($width - $sqrt2);

$circleXPos: 100% / $width;
$circleYPos: 100% / $height;

.heart {
  display: inline-block;
  font-size: 12px;
  width: $width * 1em;
  height: $height * 1em;
  background-repeat: no-repeat;
  background-size: $wedgeWidth $wedgeHeight, $wedgeWidth $wedgeHeight, 100% 100%, 100% 100%;
  background-image: linear-gradient(225deg, red, red 50%, transparent 50%), linear-gradient(135deg, red, red 50%, transparent 50%), radial-gradient(circle closest-side at $circleXPos $circleYPos, red, red 95%, transparent 100%), radial-gradient(circle closest-side at 100% - $circleXPos $circleYPos, red, red 95%, transparent 100%);
  background-position: $wedgeXPos 100%, 100% - $wedgeXPos 100%, 0 0, 0 0;
}