🌀 New CSS Loader: "Neon Orbit"
Simple, modern, and smooth.

HTML

<div class="loader" aria-label="Loading">

<span></span><span></span><span></span>
</div>

CSS

.loader{

width:56px;height:56px;
position:relative;
filter:drop-shadow(0 0 10px #00e5ff);
}
.loader span{
position:absolute;inset:0;
border-radius:50%;
border:3px solid transparent;
border-top-color:#00e5ff;
animation:spin 1s linear infinite;
}
.loader span:nth-child(2){
inset:10px;
border-top-color:#a855f7;
animation-duration:.85s;
animation-direction:reverse;
}
.loader span:nth-child(3){
inset:20px;
border-top-color:#22c55e;
animation-duration:1.15s;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* optional: center on page */
body{margin:0;min-height:100vh;display:grid;place-items:center;background:#0b1220}

Tip: Change colors or inset values to create new variants.

#css #loader #animation #fron