3d Hover Button in HTML & CSS (Pure CSS). HTML : <!DOCTYPE html> <html> <head> <title>3d button</title> </head> <body> <a href="#">SARTHAK MUND S3</a> </body> </html> CSS : body{ padding: 0; margin: 0; display: flex; align-items: center; justify-content: center; height: 100vh; background:#191970; } a{ position: absolute; padding: 20px 20px 20px 30px; color: #fff; font-size: 20px; font-family: sans-serif; text-decoration: none; text-transform: uppercase; letter-spacing: 5px; transition: .5s; } a:hover{ background: #6A5ACD; transition-delay: 2s; box-shadow: -30px 30px 50px rgba(0,0,0,.4); transform: rotate(-20deg) skew(15deg); } a:before, a:after{ content: ""; position: absolute; height: 100%; width: 2px; background: #fff; pointer-events: none; transform-style: linear; transition-property: width,opacity,transform,box-shadow; tran…
