<svg width="300" height="250">
     <polygon points="150,5 258,70 258,170.5 150,240 42,170.6 42,70" stroke="blue" stroke-width="2" fill="#def705"></polygon>
</svg>

<div id="rect">
  <svg width="300" height="300">
    <rect></rect>
  </svg>
</div>
body{
  height: 100vh;
  width: 100vw;
}

svg{
  margin: 20px;
  background-color: #d3d5df;
  padding: 20px;
  display: flex;
  
}

rect{
  width: 200px;
  height: 200px;
  fill: rgb(2 110 124);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.