dot/matrix← all loaders
CipherDecryption flashes ripple through the grid in waves.
25agent

Cipher

Decryption flashes ripple through the grid in waves.

slug
icon-25
duration
1600ms
iteration
infinite
lit cells
25 / 25
size
2.52 KB
easing
cubic-bezier(0.25, 1, 0.5, 1)

used at typical sizes

CipherDecryption flashes ripple through the grid in waves.
16px
CipherDecryption flashes ripple through the grid in waves.
24px
CipherDecryption flashes ripple through the grid in waves.
32px
CipherDecryption flashes ripple through the grid in waves.
48px
CipherDecryption flashes ripple through the grid in waves.
72px

react

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

standalone svg

svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56" role="img" aria-label="Cipher"><title>Cipher</title><desc>Decryption flashes ripple through the grid in waves.</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-25-k 1600ms cubic-bezier(0.25, 1, 0.5, 1) infinite both;}@keyframes icon-25-k{0%{opacity:0;}8%{opacity:1;}22%{opacity:0.05;}46%{opacity:0.85;}58%{opacity:0.05;}100%{opacity:0;}}@media (prefers-reduced-motion:reduce){.l{animation:none;opacity:0.45;}}.d00,.d03,.d04,.d12,.d13,.d21,.d22,.d30,.d31,.d34,.d40,.d43,.d44{animation-delay:400ms;}.d01,.d02,.d10,.d11,.d14,.d20,.d23,.d24,.d32,.d33,.d41,.d42{animation-delay:1200ms;}</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 d00" href="#l" x="6" y="6"/><use class="l d01" href="#l" x="17" y="6"/><use class="l d02" href="#l" x="28" y="6"/><use class="l d03" href="#l" x="39" y="6"/><use class="l d04" href="#l" x="50" y="6"/><use class="l d10" href="#l" x="6" y="17"/><use class="l d11" href="#l" x="17" y="17"/><use class="l d12" href="#l" x="28" y="17"/><use class="l d13" href="#l" x="39" y="17"/><use class="l d14" href="#l" x="50" y="17"/><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"/><use class="l d30" href="#l" x="6" y="39"/><use class="l d31" href="#l" x="17" y="39"/><use class="l d32" href="#l" x="28" y="39"/><use class="l d33" href="#l" x="39" y="39"/><use class="l d34" href="#l" x="50" y="39"/><use class="l d40" href="#l" x="6" y="50"/><use class="l d41" href="#l" x="17" y="50"/><use class="l d42" href="#l" x="28" y="50"/><use class="l d43" href="#l" x="39" y="50"/><use class="l d44" href="#l" x="50" y="50"/></svg>