galaxy/loaders/Shoh2008_bad-lionfish-99.html

41 lines
723 B
HTML

<div class="loader"></div>
<style>
/* From Uiverse.io by Shoh2008 - Tags: loader */
.loader {
width: 150px;
height: 150px;
border-radius: 50%;
position: relative;
box-shadow: 0 0 30px 4px rgba(0, 0, 0, 0.5) inset,
0 5px 12px rgba(0, 0, 0, 0.15);
overflow: hidden;
}
.loader:before,
.loader:after {
content: "";
position: absolute;
width: 100%;
height: 100%;
border-radius: 45%;
top: -40%;
background-color: #2e2e2e;
animation: wave 5s linear infinite;
}
.loader:before {
border-radius: 30%;
background: rgba(122, 122, 122, 0.4);
animation: wave 5s linear infinite;
}
@keyframes wave {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
</style>