Button by purplemanta6754

1button {
2  border-radius: 0.25rem;
3  text-transform: uppercase;
4  font-style: normal;
5  font-weight: 400;
6  padding-left: 25px;
7  padding-right: 25px;
8  color: #fff;
9  -webkit-clip-path: polygon(
10    0 0,
11    0 0,
12    100% 0,
13    100% 0,
14    100% calc(100% - 15px),
15    calc(100% - 15px) 100%,
16    15px 100%,
17    0 100%
18  );
19  clip-path: polygon(
20    0 0,
21    0 0,
22    100% 0,
23    100% 0,
24    100% calc(100% - 15px),
25    calc(100% - 15px) 100%,
26    15px 100%,
27    0 100%
28  );
29  height: 40px;
30  font-size: 0.7rem;
31  line-height: 14px;
32  letter-spacing: 1.2px;
33  transition: 0.2s 0.1s;
34  background-image: linear-gradient(90deg, #28285a, #6220fb);
35  border: 0 solid;
36  overflow: hidden;
37}
38
39button:hover {
40  cursor: pointer;
41  text-decoration: underline;
42  text-underline-offset: 4px;
43  font-weight: 600;
44  color: #000;
45  transition: all 0.1s ease-in;
46  background-image: linear-gradient(90deg, #9472e1, #6220fb);
47  padding-right: 32px;
48  padding-left: 32px;
49}
50
51button:active {
52  opacity: 0.5;
53  transition: all 0s;
54}
55