Skip to content

Instantly share code, notes, and snippets.

@kivervinicius
Created November 20, 2015 11:46
Show Gist options
  • Save kivervinicius/05ad3d008b675ed8a13e to your computer and use it in GitHub Desktop.
Save kivervinicius/05ad3d008b675ed8a13e to your computer and use it in GitHub Desktop.
#html
<div>
</div>
##css
div{
width: 120px;
height: 120px;
border: 5px solid #000;
border-radius: 50%;
position: relative;
}
div:before, div:after {
content: '';
display: block;
background: #000;
width: 5px;
height: 55px;
position: absolute;
transform-origin: bottom;
transform: rotate(0deg);
top: 6px;
left: 58px;
border-radius: 14px;
}
div:before{
transform: rotate(120deg);
height: 40px;
top: 19px;
animation: rotate 60s linear infinite;
}
div:after{
animation: rotate 3600s linear infinite;
}
@keyframes rotate {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment