1button {
2  --color: #0077ff;
3  font-family: inherit;
4  display: inline-block;
5  width: 6em;
6  height: 2.6em;
7  line-height: 2.5em;
8  overflow: hidden;
9  margin: 20px;
10  font-size: 17px;
11  z-index: 1;
12  color: var(--color);
13  border: 2px solid var(--color);
14  border-radius: 6px;
15  position: relative;
16}
17
18button::before {
19  position: absolute;
20  content: "";
21  background: var(--color);
22  width: 150px;
23  height: 200px;
24  z-index: -1;
25  border-radius: 50%;
26}
27
28button:hover {
29  color: white;
30}
31
32button:before {
33  top: 100%;
34  left: 100%;
35  transition: .3s all;
36}
37
38button:hover::before {
39  top: -30px;
40  left: -30px;
41}