SVG skull with HTML and CSS

<style>

.topleft-triangle {    transform: translate(59px, -250px);}
.topright-triangle {    transform: translate(-138px, -400px);}
.right-rectangle {    transform: translate(-49px, -400px);}
.left-rectangle {    transform: translate(105px, -550px);}
.left-eye {    transform: translate(-30px, -750px);}
.right-eye {    transform: translate(35px, -890px);}


</style>
<body>

<div style="display: block; margin: auto;">
    <svg style="display: block; margin: auto;">
        <rect width="110" height="150" style="fill: black;" />
        <line x1="20" y1="0" x2="20" y2="500" style="stroke:white;stroke-width:5" />
        <line x1="40" y1="0" x2="40" y2="500" style="stroke:white;stroke-width:5" />
        <line x1="60" y1="0" x2="60" y2="500" style="stroke:white;stroke-width:5" />
        <line x1="80" y1="0" x2="80" y2="500" style="stroke:white;stroke-width:5" />
        <rect width="110" height="120" style="fill: black;" />
    </svg>
    <svg class="topleft-triangle" style="display: block; margin: auto;">
      <polygon points="50,100 140,190 50,190" style="fill:black;"/>
    </svg>
    <svg class="topright-triangle" style="display: block; margin: auto;">
      <polygon points="140, 100 140,190 50,190" style="fill:black;"/>
    </svg>
    <svg class="right-rectangle" style="display: block; margin: auto;">
      <rect width="55" height="50" style="fill: black;" />
    </svg>
    <svg class="left-rectangle" style="display: block; margin: auto;">
      <rect width="55" height="50" style="fill: black;" />
    </svg>
    <svg class="left-eye" style="display: block; margin: auto;">
      <circle r="25" cx="50" cy="50" fill="white" />
    </svg>
    <svg class="right-eye" style="display: block; margin: auto;">
      <circle r="15" cx="50" cy="50" fill="white" />
    </svg>

</div>

</body>