OnomaUI

harari motion

The motion for "a single leaf falls".

はらり1 motionOfficial

Sample

A single leaf falls

Quietly clear a notice

Sways 2 times (width 18%, tilt up to 12°) while falling 200% and fading out.

Duration
1.8s
Repeats
No
Easing
ease-in-out
Animates
Position · Rotation · Opacity translate rotate opacity
Show CSS
@keyframes onoma-harari {
  0% { transform: translate(0%, 0%) rotate(0deg); opacity: 1; animation-timing-function: ease-in-out; }
  50% { transform: translate(15.6%, 81.23%) rotate(10.4deg); opacity: 0.6; animation-timing-function: ease-in-out; }
  100% { transform: translate(0%, 200%) rotate(-3.6deg); opacity: 0; animation-timing-function: ease-in-out; }
}

.onoma-harari {
  animation: onoma-harari 1.8s ease-in-out both;
}

/* Reduced motion: only fade out */
@keyframes onoma-harari-fade { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .onoma-harari { animation: onoma-harari-fade 0.2s ease-out both; }
}

Compare with similar motions