dot/matrix← all loaders
BeaconA single center dot pulses on a quiet field.
11status

Beacon

A single center dot pulses on a quiet field.

slug
icon-11
duration
1800ms
iteration
infinite
lit cells
1 / 25
size
1.32 KB
easing
cubic-bezier(0.16, 1, 0.3, 1)

used at typical sizes

BeaconA single center dot pulses on a quiet field.
16px
BeaconA single center dot pulses on a quiet field.
24px
BeaconA single center dot pulses on a quiet field.
32px
BeaconA single center dot pulses on a quiet field.
48px
BeaconA single center dot pulses on a quiet field.
72px

react

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

standalone svg

svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56" role="img" aria-label="Beacon"><title>Beacon</title><desc>A single center dot pulses on a quiet field.</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-11-k 1800ms cubic-bezier(0.16, 1, 0.3, 1) infinite both;}@keyframes icon-11-k{0%{opacity:0.12;}14%{opacity:1;}40%{opacity:0.12;}100%{opacity:0.12;}}@media (prefers-reduced-motion:reduce){.l{animation:none;opacity:0.45;}}.d22{animation-delay:0ms;}</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 d22" href="#l" x="28" y="28"/></svg>