Skip to content

Instantly share code, notes, and snippets.

@lozandier
Created November 11, 2015 23:42
Show Gist options
  • Select an option

  • Save lozandier/3af93f6b67eeb29a36b8 to your computer and use it in GitHub Desktop.

Select an option

Save lozandier/3af93f6b67eeb29a36b8 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<div class="turn"></div>
// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----
$bounce: cubic-bezier( .56, 1.78, .17, 1.65);
$rebounce: cubic-bezier( .56, 1.78, .17, 2.65);
@keyframes rotate{
to{
transform: rotate(360deg);
}
}
body{
background: black;
}
.turn{
width: 500px;
height: 40px;
margin: 40vh auto;
border-radius: 10px;
background-color: rebeccapurple;
animation: rotate 3s infinite;
animation-timing-function: $bounce
}
@keyframes rotate {
to {
transform: rotate(360deg);
}
}
body {
background: black;
}
.turn {
width: 500px;
height: 40px;
margin: 40vh auto;
border-radius: 10px;
background-color: rebeccapurple;
animation: rotate 3s infinite;
animation-timing-function: cubic-bezier(0.56, 1.78, 0.17, 1.65);
}
<div class="turn"></div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment