npm i rainbow-loader
import "rainbow-loader/css/rainbow-loader.css"
<div class="rainbow-loader"></div>
You can override .rainbow-loader
class in your own css files.
Example to change height to be 100% of parent element instead of a fixed 0.2rem, and to a slower speed :
.rainbow-loader {
height: 100% !important; /* default is 0.2rem */
animation-duration: 8s !important; /* default is 2s */
}