1.spinner {
2 position: relative;
3 width: 60px;
4 height: 60px;
5 border-radius: 50%;
6}
7
8.spinner::before,
9.spinner:after {
10 content: "";
11 position: absolute;
12 border-radius: inherit;
13}
14
15.spinner:before {
16 width: 100%;
17 height: 100%;
18 background-image: linear-gradient(0deg, #ff00cc 0%, #333399 100%);
19 animation: spin8932 .5s infinite linear;
20}
21
22.spinner:after {
23 width: 85%;
24 height: 85%;
25 background-color: #212121;
26 top: 50%;
27 left: 50%;
28 transform: translate(-50%, -50%);
29}
30
31@keyframes spin8932 {
32 to {
33  transform: rotate(360deg);
34 }
35}