dot/matrix← all loaders
PendulumA row swings left and right with simple-harmonic timing.
31ambient

Pendulum

A row swings left and right with simple-harmonic timing.

slug
icon-31
duration
2400ms
iteration
infinite
lit cells
5 / 25
size
1.61 KB
easing
linear

used at typical sizes

PendulumA row swings left and right with simple-harmonic timing.
16px
PendulumA row swings left and right with simple-harmonic timing.
24px
PendulumA row swings left and right with simple-harmonic timing.
32px
PendulumA row swings left and right with simple-harmonic timing.
48px
PendulumA row swings left and right with simple-harmonic timing.
72px

react

tsx
<DotMatrixIcon iconIndex={30} size={48} />

standalone svg

svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56" role="img" aria-label="Pendulum"><title>Pendulum</title><desc>A row swings left and right with simple-harmonic timing.</desc><defs><circle id="b" r="2.4" fill="#ffffff" opacity="0.07"/><circle id="l" r="3.1"/></defs><style>.l{fill:#ffffff;opacity:0;animation:icon-31-k 2400ms linear infinite both;}@keyframes icon-31-k{0%{opacity:0.08;}25%{opacity:1;}50%{opacity:0.08;}75%{opacity:1;}100%{opacity:0.08;}}@media (prefers-reduced-motion:reduce){.l{animation:none;opacity:0.45;}}.d20{animation-delay:1800ms;}.d21{animation-delay:2200ms;}.d22{animation-delay:0ms;}.d23{animation-delay:200ms;}.d24{animation-delay:600ms;}</style><use href="#b" x="6" y="6"/><use href="#b" x="17" y="6"/><use href="#b" x="28" y="6"/><use href="#b" x="39" y="6"/><use href="#b" x="50" y="6"/><use href="#b" x="6" y="17"/><use href="#b" x="17" y="17"/><use href="#b" x="28" y="17"/><use href="#b" x="39" y="17"/><use href="#b" x="50" y="17"/><use href="#b" x="6" y="28"/><use href="#b" x="17" y="28"/><use href="#b" x="28" y="28"/><use href="#b" x="39" y="28"/><use href="#b" x="50" y="28"/><use href="#b" x="6" y="39"/><use href="#b" x="17" y="39"/><use href="#b" x="28" y="39"/><use href="#b" x="39" y="39"/><use href="#b" x="50" y="39"/><use href="#b" x="6" y="50"/><use href="#b" x="17" y="50"/><use href="#b" x="28" y="50"/><use href="#b" x="39" y="50"/><use href="#b" x="50" y="50"/><use class="l d20" href="#l" x="6" y="28"/><use class="l d21" href="#l" x="17" y="28"/><use class="l d22" href="#l" x="28" y="28"/><use class="l d23" href="#l" x="39" y="28"/><use class="l d24" href="#l" x="50" y="28"/></svg>