Skull.html

<div x>
  <div a>
    <div c></div>
    <div>
      <div b></div>
      <div d>
        <div>
          <div e>
            <div></div>

            <style>
              * {
                margin: 0;
              }
              body {
                background: #191919;
                width: 400;
                height: 300;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
              }
              div {
                position: absolute;
              }
              [a] {
                position: relative;
                background: #4f77ff;
                width: 120;
                height: 100;
                top: -15;
                border-radius: 100px 100px 20px 20px;
              }
              [b] {
                position: relative;
                z-index: -1;
                background: #4f77ff;
                width: 80;
                height: 50;
                top: 80;
                left: 20;
                border-radius: 20px;
              }
              [c] {
                background: #191919;
                width: 40;
                height: 40;
                border-radius: 50%;
                transform: translate(15px, 52.5px);
                box-shadow: 50px 0px #191919;
              }
              [d] {
                background: #191919;
                width: 20;
                height: 20;
                border-radius: 50%;
                transform: translate(50px, 40.5px);
              }
              [e] {
                background: #191919;
                width: 10;
                height: 10;
                border-radius: 50px 50px 0px 0px;
                transform: translate(-10px, 30px);
                box-shadow: 15px 0px #191919, 30px 0px #191919;
              }
            </style>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>