Swing Hinge
Swings down around the top-left corner like a hinge.
Preview
Tune parameters
Full code
/* Swing Hinge */
@keyframes swingHinge {
0% { transform: rotate(0); }
25% { transform: rotate(70deg); }
55% { transform: rotate(50deg); }
75% { transform: rotate(65deg); }
100% { transform: rotate(0); }
}
.swing-hinge { transform-origin: top left; animation: swingHinge 1s ease-in-out both; }