OnomaUI

tekipaki motion

The motion for "brisk and efficient".

てきぱき1 motionOfficial

Sample

Brisk and efficient

Processing in progress

Snaps between 6° left and right, like a ticking clock.

Duration
0.5s
Repeats
Yes
Easing
cubic-bezier(.6,0,.4,1)
Animates
Rotation rotate
Show CSS
@keyframes onoma-tekipaki {
  0% { transform: rotate(-6deg); }
  40% { transform: rotate(-6deg); }
  50% { transform: rotate(6deg); }
  90% { transform: rotate(6deg); }
  100% { transform: rotate(-6deg); }
}

.onoma-tekipaki {
  animation: onoma-tekipaki 0.5s cubic-bezier(.6,0,.4,1) infinite both;
  transform-origin: 50% 100%;
}

/* Reduced motion: no motion */
@media (prefers-reduced-motion: reduce) {
  .onoma-tekipaki { animation: none; }
}

Compare with similar motions