Button by AmIt-DasIT
#212121
1.svg-wrapper { 2 position: relative; 3 width: 190px; 4 height: 60px; 5 text-align: center; 6 cursor: pointer; 7} 8 9.shape { 10 stroke-dasharray: 100 300; 11 stroke-dashoffset: -297; 12 fill: transparent; 13 stroke: rgb(220, 20, 60); 14 stroke-width: 5px; 15 transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s; 16} 17 18.text { 19 font-size: 22px; 20 top: -52px; 21 position: relative; 22 font-weight: 600; 23 color: white; 24} 25 26.svg-wrapper:hover .shape { 27 stroke-width: 2px; 28 stroke-dashoffset: 0; 29 stroke-dasharray: 760; 30} 31 32.svg-wrapper:hover { 33 background-color: rgba(220, 20, 60, 0.2); 34 transition: 1s; 35} 36 37
952 views
952 views
MIT License