Draw a heart in CSS (#STOP COVID-19)

.heart {
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: pink;
  height: 50px;
  width: 50px;
  transform: rotate(-45deg);
}
.heart::after {
  background-color: pink;
  content: "";
  border-radius: 50%;
  position: absolute;
  width: 50px;
  height: 50px;
  top: 0px;
  left: 25px;
}
.heart::before {
  content: "";
  background-color: pink;
  border-radius: 50%;
  position: absolute;
  width: 50px;
  height: 50px;
  top: -25px;
  left: 0px;
}

in HTML just put a div with class heart like:

<div class="heart"></div>

Demo link: https://codepen.io/danichim/pen/abOYVxo

Please wash your hands, stay/work at home and stop spreading the virus!

In the meantime, if you have any JavaScript questions, feel free to contact me. I'll do by best to create free articles to answer your questions.

Please follow me on LinkedIn / Twitter / Facebook / Codesandbox / Codepen.