Skip to content

Instantly share code, notes, and snippets.

@prenaudin
Last active January 4, 2016 08:29
Show Gist options
  • Save prenaudin/8595912 to your computer and use it in GitHub Desktop.
Save prenaudin/8595912 to your computer and use it in GitHub Desktop.
Blue Round Spinner
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Azendoo Blue Spinner</title>
</head>
<body>
<div class="az-spinner"/>
</body>
</html>
body {
padding: 50px 150px;
}
.az-spinner {
width: 24px;
height: 24px;
border-style: solid;
border-color: rgba(0,0,0,0);
border-color: #1e8bc6 transparent #1e8bc6 #1e8bc6;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
-webkit-animation: spin 0.8s infinite ease-in-out;
-moz-animation: spin 0.8s infinite linear;
-o-animation: spin 0.8s infinite linear;
animation: spin 0.8s infinite linear;
}
@-webkit-keyframes spin {
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(359deg);}
}
@-moz-keyframes spin {
from {-moz-transform: rotate(0deg);}
to {-moz-transform: rotate(359deg);}
}
@-o-keyframes spin {
from {-o-transform: rotate(0deg);}
to {-o-transform: rotate(359deg);}
}
@keyframes spin{
from {transform: rotate(0deg);}
to {transform: rotate(359deg);}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment