OnomaUI

しゅるしゅる の動き

「ほどけて回る」を表す動きです。

shurushuru1種類公式

見本

ほどけて回る

巻き戻し中

その場で1回転し、それを繰り返す。

時間
0.94s
くり返し
する
速さの変化
cubic-bezier(.45,0,.55,1)
動かすもの
回転 rotate
CSS を見る
@keyframes onoma-shurushuru {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.onoma-shurushuru {
  animation: onoma-shurushuru 0.94s cubic-bezier(.45,0,.55,1) infinite both;
}

/* 動きを減らす設定の人には、動かさない */
@media (prefers-reduced-motion: reduce) {
  .onoma-shurushuru { animation: none; }
}

近い動きと見比べる