JSFiddle - React, Tailwind, and code Playground

by akifo

HTML

<svg viewBox="0 0 200 200">
    <polygon points="20,20 20,100 120,100, 120,20"/>
</svg>

CSS

svg {
    stroke: #09d;
    stroke-width: 2;
    stroke-dashoffset: 0;
    stroke-dasharray: 5;
    fill: none;
    -webkit-transition: all 2s ease-in-out;
}

svg:hover {
    stroke-dashoffset: 100;
    stroke-width: 1;
    stroke-dasharray: 3;    
}