OnomaUI

gorogoro motion

gorogoro has 2 kinds of motion.

ごろごろ2 motionsOfficial

Motion by meaning

Rumble and roll heavily
Lounge around

Rumble and roll heavily

Heavy loading

Rolls back and forth 120% each way, rotating like a ball, forever.

Duration
1.6s
Repeats
Yes
Easing
ease-in-out
Animates
Position · Rotation translate rotate
Show CSS
@keyframes onoma-gorogoro {
  0% { transform: translate(-120%, 0%) rotate(0deg); }
  100% { transform: translate(120%, 0%) rotate(275.02deg); }
}

.onoma-gorogoro {
  animation: onoma-gorogoro 1.6s ease-in-out infinite alternate both;
}

/* Reduced motion: no motion */
@media (prefers-reduced-motion: reduce) {
  .onoma-gorogoro { animation: none; }
}
Try with my objectUse the code

Lounge around

Relaxing / idle

Rocks 10° each way on its bottom edge, forever.

Duration
2.6s
Repeats
Yes
Easing
ease-in-out
Animates
Rotation rotate
Show CSS
@keyframes onoma-gorogoro-2 {
  0% { transform: rotate(-10deg); }
  100% { transform: rotate(10deg); }
}

.onoma-gorogoro-2 {
  animation: onoma-gorogoro-2 2.6s ease-in-out infinite alternate both;
  transform-origin: 50% 100%;
}

/* Reduced motion: no motion */
@media (prefers-reduced-motion: reduce) {
  .onoma-gorogoro-2 { animation: none; }
}
Try with my objectUse the code

Compare with similar motions

gorogoroRumble and roll heavily
betobetoGreasy and gooey
biroonDroop and stretch

Words for the same motion

ごろんごろん