<div class="orb"></div>
$violet: violet;
$blue: #0ff;

body { background: #000; }

.orb {
    animation:spin 4s linear infinite;
    width: 300px;
    height: 300px;
    margin: auto;
    margin-top: 140px;
    border-radius: 50%;
    box-shadow:
        inset 0 0 50px #fff,
        inset 20px 0 60px $violet,
        inset -20px 0 60px $blue,
        inset 20px 0 300px $violet,
        inset -20px 0 300px $blue,
          0 0 50px #fff,
          -10px 0 60px $violet,
          10px 0 60px $blue;
}

@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.