preloader style : demo 218

HTML

                        

CSS

                        .preloader{
                        	height: 100px;
                        	width: 100px;
                            margin: 30px auto 0;
                        	position: relative;
                        }
                        .loader{
                            background-color: #fff;
                        	width: 5px;
                        	height: 5px;
                            border-radius: 50px;
                            position: relative;
                        	top: calc(50% - 2.5px);
                        	left: calc(50% - 2.5px);
                        }
                        .loader:before,
                        .loader:after{
                        	content: "";
                            background: linear-gradient(45deg,transparent,rgba(255, 255, 255, .3),rgba(255, 255, 255, .3),transparent);
                            width: 50px;
                        	height: 50px;
                            border-top: 3px solid #fff;
                        	border-right: 3px solid #fff;
                        	border-radius: 0 50px 0px 0;
                            transform-origin:  0% 100%;
                            position: absolute;
                        	top: -47px;
                        	animation: loader 1s linear infinite;
                        }
                        .loader:after{
                            border-top: none;
                            border-right: none;
                        	border-bottom: 3px solid #fff;
                        	border-left: 3px solid #fff;
                        	border-radius: 0 0px 0px  50px;
                        	transform-origin:  100% 0%;
                            top: 2px;
                        	right: 2px;
                        }
                        @keyframes loader{
                            0%{ transform:rotate(0deg); }
                            100%{ transform:rotate(360deg); }
                        }
                    
License Terms